web前端开发实训总结

web前端开发实训总结

　　一、web前端开发的核心技术是哪些

　　1、HTML

　　掌握HTML是网页的核心，是一种制作万维网页面的标准语言，是万维网浏览器使用的一种语言，它消除了不同计算机之间信息交流的障碍。因此，它是网络上应用最为广泛的语言，也是构成网页文档的主要语言，学好HTML是成为Web开发人员的基本条件。

　　HTML是一种标记语言，能够实现Web页面并在浏览器中显示。HTML5作为HTML的最新版本，引入了多项新技术，大大增强了对于应用的支持能力，使得Web技术不再局限于呈现网页内容。

　　随着CSS、JavaScript、Flash等技术的发展，Web对于应用的处理能力逐渐增强，用户浏览网页的体验已经有了较大的改善。不过HTML5中的几项新技术实现了质的突破，使得Web技术首次被认为能够接近于本地原生应用技术，开发Web应用真正成为开发者的一个选择。

　　HTML5可以使开发者的工作大大简化，理论上单次开发就可以在不同平台借助浏览器运行，降低开发的成本，这也是产业界普遍认为HTML5技术的主要优点之一。AppMobi、摩托罗拉、Sencha、Appcelerator等公司均已推出了较为成熟的开发工具，支持HTML5应用的发展。

　　2、CSS

　　学好CSS是网页外观的重要一点，CSS可以帮助把网页外观做得更加美观。

　　3、JavaScript

　　学习JavaScript的基本语法，以及如何使用JavaScript编程将会提高开发人员的个人技能。

　　4、操作系统

　　了解Unix和Linux的基本知识，对于开发人员有益无害。

　　5、网络服务器

　　了解Web服务器，包括对Apache的基本配置，htaccess配置技巧的掌握等。

　　二、web前端开发实训总结（通用10篇）

　　总结是对某一特定时间段内的学习和工作生活等表现情况加以回顾和分析的一种书面材料，它能够使头脑更加清醒，目标更加明确，因此我们要做好归纳，写好总结。总结怎么写才不会千篇一律呢？下面是小编为大家收集的web前端开发实训总结（通用10篇），供大家参考借鉴，希望可以帮助到有需要的朋友。

　　web前端开发实训总结1

　　所谓行万里路，必先始于足下。刚开始学习WEB前端基础的时候，老师说，其实你们学的这个后面真正去工作的时候可能也不是很会用到，所以就有很多人会问，既然我们都用不到，那干嘛还学呀？其实，对于一个程序员来说，你不仅要有很好的后端专业能力，你还应当具备一定的前端素养，知道一些起码的前端知识。

　　来到xx的第一个月，我们是以基础为主吧，因为大家到这里的基础都不一样，有一些本身就具备很高水准的人，也有很多像自己一样从小白开始的人，所以，对我们而言，xx开设的这种双元模式对我们是有很大用处的。我们从最基础的开始学习，在学习HTML的时候，我们还延续着很古老和古老的表格制作网站，然后到后面的CSS学习，用CSS样式去进一步完善我们制作的网址，再到着一期的难点JS课程体系，一级最后的JQ和BOOtstrap，可以说这个过程其实也是一个循序肩颈的过程，有简到难的过程。

　　第一部分：HTML的学习

　　其实HTML的四天学习的话，重要的就是一个标记的学习，这大概是学习一门语言最基础的一部分吧。但是也不是说背一背就解决问题的，选择IT，程序员这一方面，只要多练习，多敲代码感觉就好了，所以熟练的使用这些标记其实不是很大的问题，对自己来说，比较难的是一个表格和框架，也许会有人说，表格有什么难的，就行列的问题啊，但是不知道为什么，在学习的那几天对于表格的学习和接受能力都没有别的那么好，表格的整体框架能搭出来，但是就是对于表格的美化总做不到自己心里所预期的那样。其实练习的话也是挺多的，对于表格的网页练习做了应该也有一二十个的，但是就是没那么理想，所以这方面的话也是需要自己多加练习和修正的，因为表格的用处还是挺大的。HTML的学习方面还有框架和表单，框架的话，就是一个网页的主体了，网页的大致形式基本上从你的框架结构就可以知道的，学习框架，重要的就是网页的布局如何划分，然后利用框架的嵌套，浮动就可以解决的，学习过程也不会是很大的难度。

　　想想HTML还学了些什么呢？表单！表单对前端开发来说还是挺高的，因为我们能在一个网页中看到很多的表单应用。包括用户的注册啦，密码验证啦，还有搜索栏之类的，几乎全是表单的应用。表单学习比较重要的地方应该就是那十来个表单控件的应用，这些表单控件进一步区分的话还有就是单边标记和双边标的的表单控件，因为很多单边标记的表单，他的值一般只能是存在value当中，如果不注意的话，很多时候我们会忘记写上这个value。这个阶段的表单感觉并不是那么难，当然，学到后面的JS之后，相对于表单验证之类的才感觉难了很多。

　　第二部分：CSS学习

　　对我来说，CSS课程虽然只有三天，但是却是更应该学好的一个模块。因为我们都知道，其实一个网站的WEB前端，就是用加CSS来写的，不是用之前的表格来写的，足以见得CSS的重要性。CSS就是网页样式，一个网页的整体美感，在你确定了框架之后，就看你的CSS样式的添加了，所以一直以来都很想把CSS学好。记得CSS学习的那几天，自己的消化还是很好的，自己去独立完成练习的时候也是没有太大难度的，但是不知道是为什么，到后面学习JS JQ的时候，操作CSS时居然会吧CSS和HTML弄的有点混淆，这一点一直没做好。CSS的学习还有一个地方就是浮动，因为存在块元素和行辈元素，块元素因为其本身特性，一个块元素标记他要占用一整行的空间，而一个行内元素他只能占用行内的一些空间，但是在实际操作中，很多时候我们却要想将多个块元素排在同一行，或者将多个行内元素排在不同行，这时候就可以使用浮动的方法来实现，浮动最主要做的就是这个，唯一要记住的一点就是做了浮动之后，如果他的父元素是没有进行匡高的设定的话，是不是要进行清除浮动，防止下面的操作也是有浮动的。

　　第三部分：重点学习JS

　　JS是相对于这整个月学习的重点吧，也是很多人没办法很好接触的地方，当然，自己在这里的学习也是有不足的地方。像一些对属性的操作的标记之类，懂得怎么用，但是不是很熟悉，所以经常在操作的'时候要去查手册。学的最不好的一个地方应该是将数组中的元素按照一定的规则或者顺序添加到指定或对应的表格中，这中题型是自己做的比较少的，也是掌握很不好的地方，所以也希望用放假的这几天好好练习一下，不能拖到下一个阶段去。个人对JS的理解其实就是大量算法的集合，因为很多时候你都会用到函数，只是多了一些找元素和对元素绑定标记的过程，最重要的还是构造函数，调用函数的过程！

　　第四部分：JQ及Bootstrap

　　对于JQ和Bootstrap的学习来说，其实就是一个应用的过程吧，所有的函数都帮你写好了，你只需要学会调用就好了的。当然。调用他，其实对于JQ来说，学习的过程没有具备很大的难度，只是尝试着去多写写，写两三次基本就记住怎么用了。最后还有一天的Bootstrap学习，写过一些案例，只要会改，基本没有太大的难度。

　　其实对于WEB前端的学习的话重要的就是多用，很多东西我们上课听得时候其实都基本听得懂，但是更重要的是在于你课后的练习，离开了老师的一个思维引导，我们该怎样去完成项目才是我们该学会的。这一个月的学习难度系数都不是很高。但却是一个比较繁杂的过程，因为作为前端来说，我们需要不断的优化，不断的修正，美化整个页面。不管是前端还是后端，都希望自己能好好学！

　　web前端开发实训总结2

　　进入xxweb班近一个月了，从一无所知的小白到现在也完成了京东详情页的一个小项目。学习过程中除了偶尔遇到困难，总体还算顺利。在这里主要想分享自己以一个文科生——零基础学员的角度来学习web前端开发的感受。

　　由于之前在大学里是学的旅游专业，和计算机毫无关系，来到xx时对自己有些半信半疑。不少人甚至怀疑xx是行骗机构。在做了全面的了解之后，我劝服家人同意我来这里学习。另一方面，我向老师咨询了自己学习的方向，考虑到自己从文科到计算机专业跨度较大的转变，我在Java与web之间选择了web。相对于Java，web的学习更基础，容易入手，就业的机会也非常多。

　　Web开班第一天，老师即从网页基础、HTML入手，攫取重点，给我们介绍了它的相关知识。我们主要学习了HTML5，里面有很多的新特性且时下较为流行。它相当于一个网页界面的宏观架构。如果把一个网页的实现比作是一座建筑的建造过程，那么HTML即是这座建筑里的钢筋混泥土，搭建起整个建筑的框架、承重。

　　之后，我们又学习了CSS基础样式，仍然借用上面的比喻，CSS则相当于建筑里各个房间的不同结构，它们使得这座建筑更加的多样化。且相对于HTML，它更加的复杂、多样化，呈现的效果也具有更多的可能性。老师向我们推荐了《CSS禅意花园》这本书，里面列举了丰富且多种多样的CSS样式。

　　作为今后可能成为的优秀前端工程师，仅仅学习自己内部的知识是远远不够的。因此，第一个月中我们也学习了UI中PS绘图制作基础，这对于一个前端来说也是非常重要的，在今后的工作中，我们可能会面对各种各样的问题，如果掌握部分PS尤其是切图技术，在和UI的接触中可以减少很多不必要的繁琐工作。

　　总之，作为一个前端工程师，我们所要掌握的知识是全面的，当我们写代码时的思维是缜密的。HTML和CSS是基础中的基础。之后我们会学习更多的JavaScript相关知识和其他，希望自己在这过程中仍能保持谦逊的的心态，去学习前人留下的珍贵宝藏。

　　web前端开发实训总结3

　　仔细想来，在Web前端开发方向实习已经一年多了，从最初的DIV+CSS学起，到JavaScript、jQuery、Bootstrap框架等等，前端要学习的东西很多。接下来就总结一下我在学习过程中的一些经验吧。

　　一、学好基础知识，做一个基础扎实的开发者。

　　在IT行业，每年都会有很多新的技术诞生并且得到广泛的推广，前端技术也不例外。所以无论学到多深的程度，扎实的基本功肯定是必不可少的。

　　（1）HTML：尽量掌握尽可能多的标签。必须掌握的标签有等，这些虽然平时比较少用甚至几乎不用，但是当你学到Boostrap框架时，你会发现Boostrap框架为这些标签赋予了特定的功能与外观。除此之外，新增了很多标签和属性，使得HTML语言更加强大。还有很多新的内容，需要初学者更多的接触并掌握。

　　（2）CSS：对各个属性以及一些属性之间结合使用的技巧应该多钻研。CSS能够统一有效地对页面的布局、字体等网页中的各个元素显示属性进行控制，可以方便快捷地实现精美的页面表现效果。你会用CSS技术的使用技巧解决下列问题吗？清除浮动有哪些方式？比较好的方式是哪一种？当容器中具有浮动元素时，如何为容器设置边框或背景颜色？怎样让块级元素在容器中水平居中？当多个连续块级元素的浮动布局影响了原本不想浮动的对象时该如何处理？容器内部的对象如何实现相对于容器的自由定位？为什么要初始化CSS样式？

　　（3）CSS+div布局模式：许多布局模式的基础，也是大部分前端开发人员接触到的第一种布局方式。这种布局模式对于PC端页面的设计是非常有帮助的，同时对于后面将会遇到的“移动端布局”、“响应式布局”等，这种布局方式都具有一定的指导意义。

　　二、将JavaScript作为前端学习的重点。

　　JavaScript是目前大多数主流浏览器支持的面向对象的脚本语言，它可以在不与服务器交互的前提下对HTML的页面内容进行修改。JavaScript控制着网页的行为，决定着网页“做什么”。系统学习过JavaScript的同学们，你看看下列问题你能准确的找到答案吗？通过表达式来系统阐述“==”和“===”这两个运算符的区别。把某个元素移除你的视线的方法有哪些？你对JSON了解吗？通过哪个函数可以判断从文本框中获取的内容是不是数字？DOM操作——怎样添加、移除、移动、复制、创建和查找节点？怎样判断是否为整数？运算符都能删除哪些内容？在脚本中，this有几种使用情况呢？

　　第三、多练习多操作，实践是检验真理的唯一标准。IT编程是需要多加实践的，要不断反复进行上机操作，是学习编程开发的唯一方法。

　　这些问题的答案就是我的实习心得，经过这段时间的实习，我觉得自己可以独当一面，当一个web前端工程师了呢。

　　web前端开发实训总结4

　　作为web前端工程师，在xx工作了5个月，自己从刚开始的一名新人到最后和大家融为一体，为组内贡献自己的一份力量，我经历了很多，成长了很多。

　　刚进到公司，我内心是很惶恐的。我对自己没有一个正确的定位，对公司的环境也是那么的陌生。我不知道自己能不能胜任公司的工作。我所能做的就是努力再努力，用自己的勤奋来掩饰自己内心的慌张。

　　很欣慰的是我们组内有一个女生。她性格很柔和。每次，和他请教问题他都会耐心的帮助你。我和他成为了闺蜜，我经常的去问他问题，一些环境的配置，系统的某部分业务或者其他的问题等等。很感谢她，他帮助我尽快的去熟悉了系统的环境及业务。除了组长，组内还有李大牛和许小牛。后来许小牛走了，又来了两名同事，工作期间，他们都对我有很大的帮助，无论是工作上还是生活上，很欣慰能够遇到他们并共事一场。

　　工作中不是那么的顺利。别人是因为任务重，工作压力大。而我则是因为任务太轻而烦恼。我的任务总是比较简单，我很快就能做完，我体现不了自己的价值，我不开心。我去向组长争取机会，赢得了自己的第一份比较有挑战性的工作。

　　我要做一个webservice接口。这个任务的需求很不明确，需要我去和接口使用方进行沟通。我对系统的数据库了解甚少，对自己的库就不太了解，将他们的库对应到我们的库就更困难了。加上交流也不是很有经验，我最后搬出我们组长去跟他们沟通确定需求才开始进行开发。需求的确定用了好长时间，之后的验证也用了好久。当时开发时，接口由于没有数据，只用一条数据进行了验证，但到部署到现场时出现了好多的"问题。客户天天催，自己的压力好大。好几天都加班到好晚。这件事情比较曲折，后面的博文会详细讲述这件事情。

　　最后一个月，我们组要进行封闭开发。这是我在xx的最后一个月了。刚开始我以为不会给我分配什么有含量的活了。这里非常感谢组长，他并没有让我的这一个月荒废。我有我的任务，而且也很重要。因为这些，我可以和大家共同奋斗。全组成员一起加班到晚上两点那次，虽然很累，但是我很开心。这是一件很值得回忆的事情。曾经，我们也疯狂过。

　　web前端开发实训总结5

　　记得初到公司时，我对公司的了解仅仅局限于公司网站的简单介绍，除此之外，便一无所知了。但是，在领导和同事们的支持和帮助下，我不仅加深了对公司的了解，而且很快就掌握和熟悉本岗位工作的要求及技巧，严格做到按时按量完成产品终端页等页面的制作，保证页面的与效果图的一致性和页面在各个浏览器中的兼容性。同时，减少页面中冗余的代码，保证页面的加载速度。

　　自从担任web前端工程师以来，虽然在工作中取得了较好的成绩，但也还存在一些不足之处。例如：工作中没有充分领会领导的意图，有时会忽视公司的工作流程等等，这些都是由于工作态度和细节决定的。这些不足都需要在今后的工作中加以改进。

　　在今后的工作中，我将努力提高技术水平，克服不足，朝着以下两个方向努力：

　　1、在以后的工作中不断学习技术知识，通过多看、多学、多问、多练来不断的提高自己的各项业务技能。

　　2、提高自己解决实际问题的能力，并在工作过程中慢慢克服急躁情绪，积极、热情、细致地的对待每一项工作。

　　短短三个月的时间，我学到了很多专业的知识，能够得心应手开展工作；在一个和谐的环境下，开心的工作；可以说都是受益于各位领导的栽培和各位同事的赐教。总的来说，由于本人工作经验不多，能力还有欠缺。虽然能胜任本职工作，但是社会在不断的进步，技术在不断的更新，我还需要更多的磨砺。为此，今后在工作中，我需要进一步增强开拓创新精神，刻苦钻研新的技术。在上级的正确领导下，努力拼搏，扎实工作，以更好的质量、更高的效率、更扎实的作风做好本职工作，为我们这个光荣的集体、辉煌的事业做出应有的贡献。

　　web前端开发实训总结6

　　以前在校很少自己做程序，对软件工程更是一无所知。来到公司，开始接触"大规模"(其实现在看来实习的项目其实还是很小的)软件开发，一时真的有些迷茫。比起VSS，MVC，QA，CMMI，我对JAVA，JSP，xML的一窍不通根本不值一提。大家都不想输在"起点"，所以都默契地在加班，这样一直持续了实习的两个月。

　　刚来的时候"始业教育"显得慢吞吞，我们还经常盘算去哪哪玩之类的。我和FLYSKY(20个新生里唯一一个南区的兄弟，软件学院的)还经常出去吃各种小吃，每到一处都尝尝本地的风味,这是他的习惯。之后开始的培训还不是很难过，JAVA，C++，ORACLE，老师们讲的很"好"，可以说是非常好，好得我们没有几个人能听懂。大家开始发愁，我也是每天晚上都基本看书到10点。

　　"我心说得亏哥们我还练过"，来之前的2月份我就自己买了一本THINKING IN JAVA，看懂看不懂怎么说也算是准备了一下JAVA，C++虽说没去上过课，但凭我的直觉我就一下看中这东西很有用，自己也看过一阵.至于ORACLE，虽然不了解，但毕竟因为佩服"云飞扬"的性格和敬业精神，咱SQL选修也不是白混的。专业倒还有点"基础"，再加上咱这自学能力也不是吹的，基本维持。可等到后来的日语课就全迷糊了：本就没有语言天赋，再加上记忆严重欠缺，总是特别害怕去上日语课。不过特别喜欢那个老师说话的感觉，加上她一直对我都很好，所以还是很用心的学着。

　　随着培训的收尾，我们开始正式进入项目。从需求分析,概要设计到详细设计，我们一步一步的开始接触软件开发的每个细节。最受不了的就是每天都要记"周报"，填写自己的劳动成果。因为这个我还被QA通报了好几次呢，真的很郁闷。其实现在我很感谢这种制度化的东西，某些情况下好习惯的养成是要靠强制来确保的。详细设计之后就是企盼已久的编码，我心想终于可以做点"正事"了。现在回头一看才知道，其实编码只占软件开发的整个过程劳动量的1/4左右，而且其他的环节也不是想象中的那么无足轻重。

　　编码我其实做的很不好，主要是因为需求分析阶段就没有认真仔细的理解需求和规格说明，加上编码时一个关键时段我回校和老同学叙旧。那阵项目经理(PM)就经常和我们说，"有问题自己想办法，不要经常问我"。PM其实是在叫我们自己酝酿，遇到难题只有"憋"一"憋"才能有真的收获。而我不在的那三天正好是大家技术/思路上的一个"跃迁"，很多难题的解决方法都基本成熟，大家的编码也接近50%了，所以回来时我感觉已经掉队很多。再一个就是编码中期时机器出问题，环境搭不上了，这使我更加紧张和急躁，大大影响了我的士气。后来利用五一其间的加班我终于赶完了自己的模块，达到了第一个里程碑。其实从发现落后到加班赶完这段经历，对我来说也具有里程碑的意义。不仅考验了我自己的能力和心理素质，也证明了我对集体的责任感和合作意识。我可以叫别人来帮我做赶上进度，但那样我会错过自己学习的机会，以后再遇到难题我还是不行;我也可以硬着头皮导致项目延期，那样我以后的日子保证不好过，而且这么做也不符合我的性格。事实证明我顶住压力独立完成任务不管是对集体还是对我个人都是一件大好事。

　　web前端开发实训总结7

　　在科技高度发展的今天，计算机在人们之中的作用越来越突出。而c语言作为一种计算机的语言，我们学习它，有助于我们更好的了解计算机，与计算机进行交流，因此，c语言的学习对我们尤其重要。

　　在这个星期里，我们专业的学生在专业老师的带领下进行了c语言程序实践学习。在这之前，我们已经对c语言这门课程学习了一个学期，对其有了一定的了解，但是也仅仅是停留在了解的范围，对里面的好多东西还是很陌生，更多的`在运用起来的时候还是感到很棘手，毕竟，万事开头难嘛。

　　由于时间的关系，我们的这次实践课程老师并没有给我们详细的介绍，只是给我们简单的介绍了几个比较重要的实际操作。包括了程序模块处理.简单界面程序.高级界面程序.程序的添加修改.用程序做一元线性回归处理以及用c语言程序来画粒度分布图等这几样比较重要的时间操作。

　　上机实验是学习程序设计语言必不可少的实践环节，特别是c语言灵活、简洁，更需要通过编程的实践来真正掌握它。对于程序设计语言的学习目的，可以概括为学习语法规定、掌握程序设计方法、提高程序开发能力，这些都必须通过充分的实际上机操作才能完成。

　　学习c程序设计语言除了课堂讲授以外，必须保证有不少于课堂讲授学时的上机时间。因为学时所限，课程不能安排过多的统一上机实验，所以希望学生有效地利用课程上机实验的机会，尽快掌握用c语言开发程序的能力，为今后的继续学习打下一个良好的基础。为此，我们结合课堂讲授的内容和进度，安排了12次上机实验。课程上机实验的目的，不仅仅是验证教材和讲课的内容、检查自己所编的程序是否正确，课程安排的上机实验的目的可以概括为如下几个方面：

　　1.加深对课堂讲授内容的理解

　　课堂上要讲授许多关于c语言的语法规则，听起来十分枯燥无味，也不容易记住，死记硬背是不可取的。然而要使用c语言这个工具解决实际问题，又必须掌握它。通过多次上机练习，对于语法知识有了感性的认识，加深对它的理解，在理解的基础上就会自然而然地掌握c语言的语法规定。对于一些内容自己认为在课堂上听懂了，但上机实践中会发现原来理解的偏差，这是由于大部分学生是初次接触程序设计，缺乏程序设计的实践所致。

　　学习c语言不能停留在学习它的语法规则，而是利用学到的知识编写c语言程序，解决实际问题。即把c语言作为工具，描述解决实际问题的步骤，由计算机帮助我们解题。只有通过上机才能检验自己是否掌握c语言、自己编写的程序是否能够正确地解题。

　　通过上机实验来验证自己编制的程序是否正确，恐怕是大多数同学在完成老师作业时的心态。但是在程序设计领域里这是一定要克服的传统的、错误的想法。因为在这种思想支配下，可能你会想办法去"掩盖"程序中的错误，而不是尽可能多地发现程序中存在的问题。自己编好程序上机调试运行时，可能有很多你想不到的情况发生，通过解决这些问题，可以逐步提高自己对c语言的理解和程序开发能力。

　　2.熟悉程序开发环境、学习计算机系统的操作方法

　　一个c语言程序从编辑、编译、连接到运行，都要在一定的外部操作环境下才能进行。所谓"环境"就是所用的计算机系统硬件、软件条件，只有学会使用这些环境，才能进行程序开发工作。通过上机实验，熟练地掌握c语言开发环境，为以后真正编写计算机程序解决实际问题打下基础。同时，在今后遇到其它开发环境时就会触类旁通，很快掌握新系统的使用。

　　3.学习上机调试程序

　　完成程序的编写，决不意味着万事大吉。你认为万无一失的程序，实际上机运行时可能不断出现麻烦。如编译程序检测出一大堆错误。有时程序本身不存在语法错误，也能够顺利运行，但是运行结果显然是错误的。开发环境所提供的编译系统无法发现这种程序逻辑错误，只能靠自己的上机经验分析判断错误所在。程序的调试是一个技巧性很强的工作，对于初学者来说，尽快掌握程序调试方法是非常重要的。有时候一个消耗你几个小时时间的小小错误，调试高手一眼就看出错误所在。

　　web前端开发实训总结8

　　前端工作了一段时间经验总结，献给做前端的同学，希望对大家有所帮助。

　　一、编辑器的选择

　　推荐webstorm，绝对的神器。不要用dw了，它最骄傲的所见即所得其实没什么用，因为根本就不准，代码提示也不人性话，不方便。Webstorm的方便之处（目前用到的）

　　1.可以分屏，左右同时编辑两个文件，比如左边编辑html，右边编辑它的css/js。

　　2.代码提示很人性话，分级结构也很清洗。

　　3.方便查找，如ctrl+点击类名，就可自动定位到该css样式。

　　4.支持自定义模版，这样快速开始完成一些经常用到的代码。

　　5.支持个性化主题，字体等。

　　6.强大的插件库，自己去选吧。

　　7 .ctrl+/,注释所选区域。

　　sublime编辑器，简单灵活轻量级，支持代码自动完成、代码高亮、快速生成，以及更多好用的插件，也可以配置scss。sublime编辑器配置

　　二、布局

　　提到布局最头疼就是浏览器兼容性，现在才发现其实很多兼容性其实是很容易避免的，只要做到你对自己的每一句代码都知道它的意义和作用，还有避免用一些有兼容性的样式属性就行了，很多情况都可以不用hack，一样能实现多浏览器兼容。

　　1.不要用hack，一定有更好的解决办法。很多情况都是因为代码结构不够好才会出现兼容性问题。

　　2. 思考如何用最少的标签及属性实现页面。

　　3.理解结构，表现，行为分离的意义。

　　4. 布局前一定要先分析页面结构，磨刀不误砍柴工，分析怎么用更好的办法实现，理清思路后，再切图写代码。

　　5. 深刻理解类的概念，注重归类元素，多总结，保持代码风格（包括前后代码的空格位置、多少，以及命名风格）严格一致并且尽量简洁。

　　6. 多用组合，少用继承。

　　7. 命名空间：驼峰命名法用于区别不同单词，划线用于表明从属关系。

　　8. 低权重原则------避免滥用子选择器(即类似#test span这样的选择符)。

　　三、技巧

　　1. 写js效果时一定要注意先分析好效果的行为，尽量用最简单通用性的代码。分析步骤可以是1.先把要实现的功能一步一步的写在纸上（即自然语言）2.再根据自然语言翻译成机器语言，用jquery写的代码一定要注意代码的可移植性、通用性。

　　2. 组织css，推荐使用base、common、page三层，base可以分为两大部分：css reset（覆盖掉浏览器提供的默认样式，可以参考：developer.yahoo.com/yui/）和通用原子类。（疑问：如果使用css reset后，那么之前的要求的标签语义化是否就没有意义了呢？因为所有语义化的标签默认样式都被reset了）,不用*{ margin:0; padding:0;}的原因是因为“*”表示所有标签，其中包含大量生僻标签和为向前兼容而留下来的淘汰标签。

　　3. 把多个按钮放在一张图定位时，最好两个按钮之间隔一个像素，要不然有些版本的chrome可能解析不准确。

　　4. .clearfix:before, .clearfix:after { content: ""; display: table; } .clearfix:after { clear: both; } .clearfix { zoom: 1; } 注意如果用了浮动，一定要清除浮动，深刻理解浮动的作用很重要。 在层里调整文字的垂直位置可以用1.lineheight2.padding。 注意模块化布局，增加代码的重用性，尽量只给最里层的内容层设高度，一般如果高度不确定的都设置成自适应，这样有助于内容拉伸，也便于修改模块的高度。 大框架，尽量简单的分，比如左右结构最好就设置成左右，没必要搞成左中右。 尽量不要在html代码里插入img，把他设置在结构里，然后用css插入图片。

　　5. jquery编程习惯可以参考：

　　把所有用$（）选中的元素保存在前缀为$的js变量里2.每个函数结束都要用return false 结束掉函数。

　　6. 布局前，先构思好整个页面的结构，一个好的结构要便于维护，加载更快，布局时也更容易。布局时，稳扎稳打，一步步弄好后（既没有用hack，也没有兼容性问题了），再布局下一个板块。 布局一个带js效果的页面，要先把效果图上的页面效果，完整布局好后，再考虑加动作的事情。并且一定要分析好页面的结构，以最少的标签，以及标签要与所放内容对应来布局。

　　7. jquery代码一般要用$(document).ready(function(){}确保页面dom准备好了再进行js操作。 页面按钮点击时边框变红，点击完后边框变蓝可以用outline:none;解决。 有动画的层最好设置overflow：hidden以免层里面的内容在外层宽高改变时撑出层外。

　　8. 写js效果时一定要注意先分析好效果的行为，尽量用最简单通用性的代码。分析步骤：

　　1.先把要实现的功能一步一步的写在纸上（即自然语言）

　　2.再根据自然语言翻译成机器语言，用jquery写的代码一定要注意代码的可移植性、通用性。

　　9. a标签的四种状态的排序问题，可以用love hate 原则，即l（link）ov（visited）e h（hover）a（active）te，顺序写错可能出现点击后hover样式失效。

　　10. 一般情况下，建议尽量使用class，少用id。

　　11. css编码风格：多行式和一行式。 多行式：可读性强，但使行数过多，编辑需要来回拖动滚动条，影响开发速度，增大css文件大小。 一行式：可读性稍差，有效减小css文件行数，有利于提高开发速度，同时减小css文件大小。 一行式逐渐成为主流。

　　12. css sprite：即把多个甚至所有的图标都放在一张图里，然后用背景定位来控制图标的显示。 使用难点：图片如何排列能够紧凑，同时保证不会影响扩展性。 优点：减少http请求数，减小服务器压力。 缺点：影响开发速度，大大降低了可维护性。 是否使用取决于网站流量，对于流量不大的网站来说，css sprite带来的好处并不明显，而付出的代价是巨大的，不划算。

　　13. 定义有：hover伪类的样式时，多定义一个它的hover类，这样有助于js调用生成current的效果，如定义btn{xxx}，btn：hover，btn_hover{xxx}。

　　14. 低权重原则避免滥用子选择器(即类似#test span这样的选择符)。 css的选择符是有权重的，当不同选择符的样式设置有冲突时，会采用权重高的选择符设置的样式。 规则：html标签的权重是1，class的权重是10，id的权重是100.如“div em”的权重是1+1=2，“strong.demo”的权重是10+1=11，“#test.red”的权重是100+10=110. 如果css选择符权重相同，那么样式会遵循就近原则，哪个选择符最后定义，就采用哪个选择符的样式，与挂class名的先后顺序无关。 为了保证样式容易被覆盖，提供可维护性，css选择符需保证权重尽可能低。

　　15. 如果不确定模块的上下margin特别稳定，最好不要将它写到模块的类里，而是使用类的组合，单独为上下margin挂用于边距的原子类（例如mt10、mt20）。模块最好不要混用margintop和marginbottom，统一使用margintop或marginbottom。

　　16. 拆分模块技巧：

　　模块与模块之间尽量不要包含相同的部分，如果有相同部分，应将它们提取出来，拆分成一个独立的模块。2.模块应在保证数量尽可能少的原则下，做到尽可能简单，以提高重用性。

　　17. 触发hasLayout一般情况用zoom：1就行了，但当用dhtml的时候，可能失效，这时用position：relative就行了。

　　18. 布局最基本的元素：块级元素（常见：div,p,form,ul,ol,li）和行内元素（span,strong,em）等。 块级元素：独占一行，默认情况下，其宽度自动填满父元素宽度（即使设置了宽带也会独占一行）。 行内元素：不会独占一行，相邻的行内元素会排列在同一行里，直到一行排不下，才会换行，其宽度随元素的内容而变化（没有上下边距，只有左右边距）。 可以用display：inline/block，切换。

　　19. ie6、7不支持display：inline-block，但行内元素可以用此属性触发hasLayout（是ie浏览器为解析盒模型而设计的一个专有属性，它的设计初衷是用于块级元素的，如果触发行内元素的hasLayout，就会让行内元素拥有一些块级元素的特性），从而模拟出inline-block的效果，然后再用*vertical-align控制文字的垂直对齐。但这样做用hack，所以不推荐。

　　20. 排列地板砖一样的布局的元素时，尽量用给每个元素用相同的类来实现，如果最左边的元素间距和右边的有区别可以给所有元素套一个父层，然后设置其右边距为负就行了。

　　21. 如果一个类中有些部分会经常变化，我们可以将这个经常变化的部分抽离出来单独设成一个类，然后用组合来实现最终样式。

　　22. 可以用(function(){})(),这样的匿名函数来避免全局变量冲突。让js不产生冲突，需要避免全局变量的泛滥，合理使用命名空间以及为代码添加必要的注释。可以定义一个全局对象，然后用其属性来定义全局变量，同时结合命名空间（即类似，GLOBAL.A.xx,和GLOBAL.B.xx之类的）。

　　四、常见问题

　　1. ie只有a支持hover,并且注意a里要有href才行。

　　2. IE6中用了float:left之后导致margin-left双倍边距的BUG解决方法加上display:inline

　　3. 如果存在文字在层居中的问题，水平方向可以用text-align代替，垂直方向可以用line-height来控制，如果只是控制上边距，就用padding-top。这样可以避免在ie6上的某些不必要的错误。

　　4. ajax传参数时，汉字一定要用encodeURIComponent（string），编码一下，要不然可能变成乱码中文在ie6里。

　　5. ie6下select元素会以窗口形式显示的，这是ie6的一个bug，所以当你设置一层为相对或绝对定位时，select仍然会浮在那个层之上。 解决方法，用一个和那个层同样大小的iframe放在test下面，select上面，用iframe遮住select。

　　web前端开发实训总结9

　　一、实训项目

　　简易记事本

　　二、实训目的和要求

　　本次实训是对前面学过的所有面向对象的编程思想以及JavaWEB编程方法的一个总结、回顾和实践，因此，开始设计前学生一定要先回顾以前所学的内容，明确本次作业设计所要用到的技术点并到网上搜索以及查阅相关的书籍来搜集资料。

　　通过编写采用JSP+Servlet+JavaBean技术框架的应用系统综合实例，以掌握JavaWEB开发技术。

　　具体要求有以下几点：

　　1、问题的描述与程序将要实现的具体功能。

　　2、程序功能实现的具体设计思路或框架，并检查流程设计。

　　3、代码实现。

　　4、设计小结。

　　三、实训项目的开发环境和所使用的技术

　　基于J2SE基础，利用MyEclipse8.5以上版本的集成开发环境完成实训项目，界面友好，代码的可维护性好，有必要的注释和相应的文档。

　　四、实训地点、日程、分组情况：

　　实训地点：4栋303机房

　　日程：

　　第一阶段：

　　1、班级分组，选定课题，查阅相关资料半天。

　　2、划分模块、小组成员分工半天。

　　3、利用CASE工具进行系统设计和分析，并编制源程序5天。

　　第二阶段：上机调试，修改、调试、完善系统2天。

　　第三阶段：撰写、上交课程设计报告，上交课程设计作品源程序（每人1份）2天。

　　web前端开发实训总结10

　　一、实训目的

　　通过对java语言、JavaWeb、Oracle数据库应用设计及SQL语言的复习和锻炼，并且通过使用MyEclipse开发平台设计库存管理系统项目，以达到充分熟悉开发平台及其应用设计。

　　同时掌握并实践软件项目设计规范及其开发流程：需求分析、概要设计、详细设计、代码编写、系统测试及软件手册编写，以便提前适应软件公司开发流程、环境和工作要求进一步了解java开发的相关知识，掌握java开发的基本技术，丰富java开发的实战经验。

　　学习SQL的基础知识及正确的运用方法，和有用的相关技术，提高自己的工作效率。

　　通过实训，培养我们综合运用已学知识Java语言的面向对象编程能力；培养我们动手能力；培养我们良好编程规范、编程方法；以便能较全面地理解、掌握和综合运用所学的知识，提高自身的编程能力；增强自己的团队协作意识，了解软件开发的思考角度和主要流程。

　　为毕业之后能够更快地进入工作状态并且能够更好的工作，打好一定的基础。

　　二、实训主要流程

　　1、公司管理规则，程序员素质，程序员编码规范；

　　2、需求开发与管理；

　　3、面向对象分析与设计，面向对象编程的特性；

　　4、javaSE、javaWeb、页面设计—JSP页面；

　　5、数据库设计、SQL应用；

　　6、软件需求分析与设计；

　　7、项目实战；

　　三、实训内容

　　1.Oracle数据库

　　数据库是数据的结构化集合。

　　计算机是处理大量数据的理想工具，因此，数据库管理系统在计算方面扮演着关键的中心角色，或是作为独立的实用工具，或是作为其他应用程序的组成部分。

　　Oracle服务器还有一套实用的特性集合，这些特性是通过与我们用户的``密切合作而开发的。

　　在我们的基准测试主页上，给出了Oracle服务器和其他数据库管理器的比较结果。

　　Oracle服务器最初是为处理大型数据库而开发的，与已有的解决方案相比，它的速度更快，多年以来，它已成功用于众多要求很高的生产环境。

　　尽管Oracle始终在不断发展，但目前Oracle服务器已能提供丰富和有用的功能。

　　它具有良好的连通性、速度和安全性，这使的Oracle十分适合于访问Internet上的数据库。

　　2.java与SQL的应用。

　　Java语言是编写数据库应用程序的杰出语言之一，它提供了方便访问数据的技术。

　　利用Java语言中的JDBC技术，用户能方便地开发出基于Web网页的数据库访问程序，从而扩充网络应用功能。

　　JDBC（Java Database Connectivity，Java数据库连接）是一种用于执行SQL语句的Java API，可以为多种关系数据库提供统一的访问接口。

　　JDBC由一组用Java语言编写的类与接口组成，通过调用这些类和接口所提供的方法，用户能够以一致的方式连接多种不同的数据库系统（如Access、SQL Server 20xx、Oracle、Sybase等），进而可使用标准的SQL语言来存取数据库中的数据，而不必再为每一种数据库系统编写不同的Java程序代码。