cssdiv学习心得
div+css的自学总结
5.应用web标准制作网页，建立自己的web标准代码规范，提高开发效率
web标准现在还是在推广之中，没有一个成熟的模式，毕竟需要手写代码，你这时就可以根据自己的经验提出一些提高自己开发效率的方法，可以把一些常用的代码片段，习惯的css命名，和一些能够重复使用的功能模块作成代码剪辑提高代码的复用性！
使用<div>配合CSS为你的网页布局，而不要使用table了，这样的文章很多，实例也很多，推荐你去，div布局的好处很多，就提级几个实用的：
1.代码冗余小，网页打开速度快。
2.结构和表现分离了，你可以只通过css改变你的布局，而信息不变，这样维护和升级的成本降低了。
（3）总结两种定位的特征
绝对定位就像是把不同对象安排到了一栋高楼的不同楼层(一般指不是第一层，我们这里理解为文本流就放在首层)，它们互不影响，但是它们怎么移动与你楼的地基和面积（父级）有关。相对定位指对象还是在首层楼与文本流一起存放，它们之间肯定存在影响。
绝对定位（absolute）：将被赋予此定位方法的对象从文档流中拖出，使用left，right，top，bottom等属性相对于其最接近的一个最有定位设置的父级对象进行绝对定位，如果对象的父级没有设置定位属性，即还是遵循HTML定位规则的，则依据body对象左上角作为参考进行-index值为无单位的整数，大的在最上面，可以有负值（目前负值FF不支持）。
2.建立标准化的声明(DOCTYPE)和head
以前的网页，甚至大型的门户网站也连个声明也没有，就仅仅是<html>，现在要做的就是给你的网页加上声明，规范head区域，让搜索引擎和喜欢你的网站。
推荐写法
<!--(1)过渡型（Transitional）--> <!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <!--(2)严格型（Strict）--> <!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Strict//EN""/TR/xhtml1/DTD/xhtml1-strict.dtd"> <!--(3)框架型（Frameset）--> <!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Frameset//EN""/TR/xhtml1/DTD/xhtml1-frameset.dtd"> <!--设定一个名字空间（Namespace）lang="zh-CN"/--> <htmlxmlnshtmlxmlns="/1999/xhtml"lang="zh-CN"> <head> <!--声明你的编码语言:GB2312/UTF-8/Unicode/ISO-8859-1--> <metahttp-equivmetahttp-equiv="Content-Type"content="text/html;charset=GB2312"/> <metahttp-equivmetahttp-equiv="Content-Language"content="zh-CN"/> <!--为搜索引擎准备的内容--> <!--允许搜索机器人搜索站内所有链接。如果你想某些页面不被搜索，推荐采用robots.txt方法--> <metacontentmetacontent="all"name="robots"/> <!--设置站点作者信息--> <metanamemetaname="author"content=webmaster@,建站学/> <!--设置站点版权信息--> <metanamemetaname="Copyright"content=",版权所有"/> <!--站点的简要介绍(推荐)--> <metanamemetaname="description"content="网站制作,网页制作技术教程站"/> <!--站点的关键词(推荐)--> <metacontentmetacontent="网页,网页制作,网页教学,网页设计"name="keywords"/> <!--收藏夹小图标--> <linkrellinkrel="icon"href="/favicon.ico"type="image/x-icon"/> <linkrellinkrel="shortcuticon"href="/favicon.ico"type="image/x-icon"/> <title>网页标题</title> <!--连接样式表--> <linkrellinkrel="stylesheet"rev="stylesheet"href="css/style.css"type="text/css"media="all"/> <styletypestyletype="text/css"media="all">@importurl(css/style01.css);</style> <!--RSS--> <linkrellinkrel="alternate"type="application/rss+xml"title=""href="/"/> <!--JS--> <scriptsrcscriptsrc="/upload/tu/upload/js/jzxuecom.js"type="text/javascript"language="javascript""></script> </head> <body></body> </html> 3.学习div配合CSS进行网页布局
DIV+CSS网页布局心得
DIV+CSS⽹页布局⼼得我们在⼀直强调交流的重要性，只有通过交流才能发现⾃⼰的不⾜，才能明确的知晓⾃⼰到底掌握了多少知识，哪些地⽅不⾜，哪些地⽅已经掌握，今天与⼤家分享⼀位jb51⽹友的DivCSS⽹页布局⼼得。
DIV+CSS是⽬前互联⽹⽹页制作最热门的⽅法，但对于完全⼿写代码，许多⽹页设计师都望⽽⽌步。
其实DIV+CSS是很简单的⼀种布局⽅式，甚⾄⽐任何⼀种编程语⾔都要简单(虽然它不能算是编程语⾔)。
⾸先你要知道，当你开始学习DIV+CSS的时候，你要把以前所有⽤DW画布局表格的思维⽅法忘的⼀⼲⼆净(如果你以前是⽤TABLE布局的话)，然⽽这项技术更适合刚接触⽹页制作的⼈。
然后你要知道，DIV+CSS是⾼成本开发，速度当然是没有你画TABLE来的快，但是好处更多，相信如果你能看到这⾥，你⼀定对DIV+CSS的好处也有⼀定的了解了。
最后你还得知道，你所⽤的⼯具，你可能认为Dreamweaver很好，没错，它的确不错，但你要认识到，当你熟练使⽤了这门技术，你就可以在任何⽂本编辑器中编写⽹页，甚⾄在记事本中，⽽dreamweaver只是充当⼀个⽂本编辑器的⾓⾊，⽽你所有的⼯作基本都在代码视图中完成，在这⾥我推荐adobe最新的dreamweaver cs4。
当然如果CS5出现了我也会去试⽤它。
切⼊正题，其实DIV+CSS正确的说法应该是XHTML+CSS，说成DIV的原因只是让它能更明确地和TABLE布局⽅法区分开来，并不是说⼀个页⾯⾥没有TABLE，⽽是在什么地⽅使⽤TABLE，你要认识到TABLE是表格，是存放数据⽤的，⽽不是⽤来布局的。
接下来是布局思维⽅式，可能⼤家在接触DIV+CSS的时候⽆从下⼿，我现在向⼤家推荐最著名的盒⼦模型，我也是看了这个模型后⼀下⼦就开窍了。
你可能会说，好多英⽂看不懂，不过我告诉你，很抱歉那三个英⽂你必须记住，⽽且是最重要的三个，你可以把这么个盒⼦看成⼀个DIV，⽽所有标签都带有这三个属性。
网页制作DIV+CSS工作心得体会
网页制作DIV+CSS工作心得体会一、头部的定义1、content=“IE=EmulatEiE7" 这句是把IE8 浏览器强制使用IE7的兼容模式2、头部的DTD定义要根据需要定义（一般不用管它）二、DIV布局1、居中问题：IE通过设置text-align属性为center可以实现，margin:0 auto;可以实现ＤＩＶ居中，但前提是DIV不能再float。
bodydiv id=”wrapper”/divbody#wrapper { Width:720px; Margin:0 auto; }2、Div之间默认是会自动换行的，如果要实现不换行就要应用float或借助绝对定位。
同级的元素尽量同时浮动或者不浮动，这样有利于控制和兼容性。
3、绝对定位问题：如果一个父Div的几个子Div要实现绝对定位，切记父Div的position属性一定要设置为relative，几个子Div的position则设置为absolute。
为了实现子Div的精准定位，子Div的高度和宽度都建议明确规定像素大小。
Z-index属性值为整数，属性值大的在上层。
Left、right、top、bottom、四个属性控制子DIV的位置。
4、外连文件式CSS放在在网页的〈head〉与〈/head〉之间加上一句这样的代码：〈link rel="stylesheet" href="在这里填上你的CSS文件地址（相对路径+文件名）" type="text/css"〉5、首行缩进“text-indent”右面的缩进单位选择框中“em”指的就是字符位（1汉字）。
6、盒子模型虚线内部是内容显示的地方，黄色的地方是算在border里面的，同时背景图片也是计算黄色区域的面积的（padding与背景图片这样经常搭配实现一些效果的）。
三、CSS样式1、CSS权重（优先级）div class="case1" id="case2" style="cloor:red"/divstyle.case2{样式内容}#case2{样式内容}/style以上为例：权重最高的是style="cloor:red"，然后是ID="case2" 最后是class。
css实训总结
CSS实训总结在这次CSS实训中，我学到了很多关于CSS的知识和技能。
通过实际操作，我深入了解了CSS的选择器、样式规则、布局和响应式设计等重要概念。
以下是我对这次实训的总结：1. CSS基础知识：在实训开始之前，我重新温习了CSS的基础知识，包括选择器、样式规则、颜色和字体、盒模型等。
这些基础知识对于理解CSS的核心概念非常重要。
2. 选择器：在实训中，我学习了更多的选择器，如类选择器、ID选择器、属性选择器等。
这些选择器让我能够更精确地定位和样式化页面元素。
通过使用不同的选择器，我可以根据需要选择单个元素或一组元素进行样式化。
3. 样式规则：在这次实训中，我学习了更多的CSS样式规则，如背景、边框、阴影、渐变等。
通过这些样式规则，我可以创建更加美观和专业的网页设计。
此外，我还学习了如何使用CSS动画和过渡效果，为网页添加动态效果。
4. 布局：在实训中，我学习了如何使用CSS进行页面布局。
通过使用Flexbox和Grid布局，我可以轻松地创建复杂的页面布局。
这些布局方法使得页面元素的排列和分布更加灵活和可控。
5. 响应式设计：在这次实训中，我学习了如何使用媒体查询和响应式设计。
通过使用媒体查询，我可以根据不同的设备和屏幕尺寸，应用不同的样式规则。
这使得我的网页能够在各种设备和屏幕尺寸上良好地显示和使用。
6. 实际应用：在实训中，我通过实际项目来应用所学的CSS知识。
我为一个虚构的网站设计了样式，并实现了响应式布局。
在这个过程中，我遇到了很多问题，但通过查阅文档和请教老师，我成功地解决了这些问题。
这个过程让我更加深入地理解了CSS的实际应用和技巧。
7. 总结：通过这次CSS实训，我不仅温习了基础知识，还学习了更多的高级技能。
我掌握了如何使用选择器、样式规则、布局和响应式设计来创建美观而专业的网页。
这次实训对我的专业技能的提升非常有帮助，也为我未来的职业发展打下了坚实的基础。
cssdiv学习心得
cssdiv学习心得竭诚为您提供优质文档/双击可除cssdiv学习心得篇一：基于css+DIV方式的网页设计的心得体会基于css+DIV方式的网页设计的心得体会现在，计算机和网络已经深入到了我们生活中的方方面面，也已经成了生活中不可缺少的一部分，网络成了我们获取知识和信息的一种便捷工具，现在的网民也在不断的增多，所以，了解和学习网络知识是我们作为一名大学生迫切所需的。
我利用这一学期的时间，对网页设计进行了初步的认识和了解。
综合网站技术和设计人员的体会，css+DIV网站建设具有以下优势和不足，其中css网页布局的优点体现在如下方面：一、使页面载入得更快由于将大部分页面代码写在了css当中，使得页面体积容量变得更小。
相对于表格嵌套的方式，DIV+css将页面独立成更多的区域，在打开页面的时候，逐层加载。
而不像表格嵌套那样将整个页面圈在一个大表格里，使得加载速度很慢。
二、降低流量费用页面体积变小，浏览速度变快，这就使得对于某些控制主机流量的网站来说是最大的优势了。
三、修改设计时更有效率由于使用了DIV+css制作方法，在修改页面的时候更加容易省时。
根据区域内容标记，到css里找到相应的ID，使得修改页面的时候更加方便，也不会破坏页面其他部分的布局样式。
四、保持视觉的一致性DIV+css最重要的优势之一：保持视觉的一致性；以往表格嵌套的制作方法，会使得页面与页面，或者区域与区域之间的显示效果会有偏差。
而使用DIV+css的制作方法，将所有页面，或所有区域统一用css文件控制，就避免了不同区域或不同页面体现出的效果偏差。
五、更好地被搜索引擎收录由于将大部分的hTmL代码和内容样式写入了css文件中，这就使得网页中正文部分更为突出明显，便于被搜索引擎采集收录。
六、对浏览者和浏览器更具亲和力我们都知道网站做出来是给浏览者使用的，对浏览者和浏览器更具亲和力，DIV+css在这方面更具优势。
由于css 富含丰富的样式，使页面更加灵活性，它可以根据不同的浏览器，而达到显示效果的统一和不变形。
DIV+CSS布局使用的个人心得
DIV+CSS布局使⽤的个⼈⼼得⽹站制作离不开⽹页布局就是说DIV+CSS都会涉及到的，以下是⼯作中总结的⼀些技巧，留下备⽤，也可以学习。
1、ul：默认的ul的margin和padding不是0，如果在导航中⽤到了左浮动的li，往往会把外部的div撑⼤，导致页⾯变形，改成：ul{margin:0px; padding:0px;}2、img：（1）这⾥牵涉的不同浏览器的问题，ie6⾥显⽰的图⽚height总是要⼤于准确值，这⾥就需要我们记住下⾯这⼀点 img{ display：block}；（2）页⾯中最好不要⽤⼤块背景，能平铺的要平铺，否则加载起来会很慢，也不利于以后的优化和扩展，当然也有些⼤的⽹站，现在都尽量把背景统⼀放到⼀张图⽚上，⽤background-postion来取得背景。
（3）最好的格式就是gif格式，即确保了背景透明，在ie6中⼜不会有阴影，有时gif图⽚会有锯齿，这就需要我们保存成web格式，设置⼀下matter，matter的值⽤背景颜⾊的值越相近越好。
3、overflow：有时⼀些公司的注册协议都是很长，这就⽤到了overflow，可以把div的style⾥加上这个：overflow：auto4、float：有时候⼀些div会挤到页⾯的上⽅，这⾥可能就是浮动引起的，可以加上clear：both。
5、div：height等于1px的div，在ie6中可能并不是1px，在这个div的style⾥加上font-size：1px;这样就ok了。
6、id和class：当⼀个样式在页⾯中多次使⽤时，不要⽤id，要⽤class，要使⽤js的时候，样式最好不要⽤id，因为id要留给js使⽤。
7，link：.link：link{}、.link：visited{}、.link：hover{}、.link：active{}。
有⼀点，visited与hover的顺序⼀定不能倒换，否则ie6中会⼤⼤的问题。
实训4 div+css综合运用
实训4 div+css综合运用一、背景介绍在Web开发领域，div和css是两个基础、重要的概念。
div是HTML中的一个标签，用来划分网页的结构和布局；而css是一种样式表语言，用于描述HTML文档的呈现方式。
实训4中涉及到了div 和css的综合运用，旨在帮助学习者掌握这两个技术，并且能够灵活运用于实际项目中。
二、整体评估在实训4中，学习者需要通过实际操作，完成一个包含头部、导航、内容区域和底部的网页布局。
这样的任务要求对div和css的综合运用提出了很高的要求，需要考虑到页面的整体结构、样式和布局。
在评估过程中，我发现学习者需要注意以下几点：1. 结构清晰：div标签应该按照页面的结构和布局来合理地进行划分和嵌套，以确保页面结构清晰、层次分明。
2. 样式统一：css样式应该对整个页面起到统一、协调的作用，保证整体的美观和一致性。
3. 响应式布局：在综合运用中，需要考虑到不同设备上的显示效果，保证页面能够适配不同的屏幕尺寸。
4. 创新设计：除了基本的布局要求，学习者还可以通过css的特效和动画等进行创新设计，提升页面的互动性和吸引力。
三、文章撰写在本次实训4中，我们深入学习了div和css的综合运用，从理论到实践，都有了全面的了解和掌握。
通过对div的合理划分和css的样式设置，我们可以轻松实现一个精美、完善的网页布局。
在整个过程中，我对div和css的重要性有了更深的理解。
div作为网页设计中最基础的组件，它的合理划分和嵌套对于页面的结构和布局起着至关重要的作用。
通过div的灵活运用，我们可以将页面分割成不同的模块，从而更好地呈现页面内容，提高用户的浏览体验。
css则是页面样式的设计师，通过设置各种样式属性，我们可以实现页面的美化和个性化定制。
通过css的盒子模型、浮动布局、弹性布局等特性，我们可以完美定制各种不同风格的网页布局。
在综合运用的过程中，我深刻体会到了对div和css的熟练掌握意味着更自由地实现网页设计的愿景。
div实训报告
DIV实训报告以下是一个示例的DIV实训报告，供您参考：标题：DIV实训报告一、实训目标通过本次实训，旨在掌握DIV元素的概念、使用方法和常见应用场景，提高网页布局和样式设计的能力。
二、实训内容1. DIV元素的基本概念与使用方法DIV元素是一种块级元素，用于将文档中的内容划分为独立的区域。
通过使用DIV元素，可以将文档中的不同部分组织成树状结构，方便样式和脚本的应用。
在HTML中，DIV元素使用“<div>”标签来表示。
2. DIV元素的常见应用场景（1）网页布局：使用DIV元素可以轻松实现网页的布局和排版。
例如，可以将页面的主要内容区域放置在一个DIV中，再将其划分为多个子DIV，分别用于导航、主体内容和侧边栏等部分。
（2）样式设计：通过给DIV元素添加样式属性，可以改变其背景颜色、边框样式、字体大小等外观属性。
此外，还可以使用CSS来定义DIV元素的布局属性，如宽度、高度、内边距和外边距等。
3. 实训项目：制作一个简单的网页布局本次实训项目是制作一个简单的网页布局，包括页头、页脚、导航栏和主体内容区域。
具体步骤如下：（1）创建一个HTML文件，将页头、页脚、导航栏和主体内容区域分别放置在不同的DIV中。
（2）为每个DIV元素添加相应的CSS样式，以实现网页的布局和外观效果。
（3）在HTML文件中添加必要的链接和脚本元素，以实现页面的交互功能。
三、实训成果展示经过本次实训，我成功地制作了一个简单的网页布局，包括页头、页脚、导航栏和主体内容区域。
以下是成果展示：（请在此处插入网页布局效果图）四、总结与反思通过本次实训，我深入了解了DIV元素的概念和使用方法，掌握了常见的应用场景。
同时，通过实际操作，我也发现了自己在网页布局和样式设计方面存在的不足之处。
为了进一步提高自己的能力，我将继续学习和实践，不断探索和学习新的技术和方法。
div心得体会400字
div心得体会400字
一个多月的网站建设，我学到许多专业知识，这些专业知识是在不断的学习实践中得到的。
现在我已经能够熟练地使用网页三剑客中的一些常用功能了，如用ps做网页效果图、处理图片等，使用dw中的css样式，用flash实现一些简单的动画效果等。
但是在这三个软件中，对于flash的运用还比较生疏，对于这些软件中那些深层次的功能还没有涉及，这些缺陷都将是我以后学习攻克的目标。
在炎热的夏季，又在闷热的机房中，我们又一次的完成了网站建设的实习。
在这实习期间，有太多的话想说，都是苦不堪言。
但事后又想想，苦过了，才知道有甜。
在这实习当中，我知道了div是html(超文本语言)中的一个元素,div+css 是一种网页的布局方法,div+css包括行内样式、内嵌式、链接式、导入式、css选择器、标记选择器、类别选择器、id选择器、选择器声明、css继承。
还有id与class区别：id不允许重复使用，只能用一次，css规范和其他规范javascript控制方法一样。
说实话，我对div+css一点儿都不懂，但起码我知道了这是一种网页的布局格式，总比不知道强。
有句话说，不懂就要学。
是的，既然学了了这个专业，就不能对这个专业模糊。
所以，就要学习学习再学习。
征服畏
惧、建立自信的最快最确实的方法，就是去做你害怕的事，直到你获得成功的经验。
div+css学习总结材料
div+css 第一天：1初识CSS1.1介绍1.2原理图1.3快速案例test.html:1.4三个时期主要容1.6必要性案例：使用<span>元素1.7思考（滤镜——图片变成黑白色）2 CSS的选择器——通配符，html，类，idHtmlPage1.html:my.css:my.css:2.3html选择器2.4综合练习：HtmlPage1.html:my.css:第二天2.5通配符选择器2.6父子选择器页面效果：HTML:CSS:2.7id选择器和类选择器同时修饰html：CSS：注：重叠的部分是以id的为准，如颜色样式，其他不重叠的部分还要正常显示class中的部分.在一个元素中不能有两个及以上id选择器，但可以有多个class选择器2.8将类选择器和id选择器相同部分的容整合2.9课堂练习练习1html:CSS:练习2html：CSS：3 块元素和行元素3.1概念3.2各自存放的容及相互转换4 CSS核心容4.1流小知识：配置eclipse模板：4.2 CSS的盒子模型案例：页面：HTML：CSS：4.3 盒子模型综合案例该案例可以当做一个模板来使用，很多大型都有用到。
CSS：HTML：4.4. 盒子模型练习CSS：html4.5 浮动第三天容回顾4.6浮动理解强化代码：（一）（二）对应页面：（一）（二）4.7清除浮动4.8 定位relativehtmlCSSabsolutestaticfixed（只能相对body定位）5 仿sohu页面图片在div中居中的方法。
div+css js+jQuery两周学习总结
变量可以使用短名称（比如 x 和 y），也可以使用描述 性更好的名称（比如 age, sum, totalvolume）。
• 变量必须以字母开头 • 变量也能以 $ 和 _ 符号开头（不过我们不推荐这么做） • 变量名称对大小写敏感（y 和 Y 是不同的变量）
声明（创建） JavaScript 变量
多行注释以 /* 开始，以 */ 结尾。
例：/* 下面的这些代码会输出 一个标题和一个段落 并将代表主页的开始 */ document.getElementById("myH1").innerHTML="Welcome to my Homepage";
JavaScript变量
变量是存储信息的容器。
JS中使用的条件语句
条件语句用于基于不同的条件来执行不同的动作。 • if 语句 - 只有当指定条件为 true 时，使用该语句来执 行代码 • if...else 语句 - 当条件为 true 时执行代码，当条件为 false 时执行其他代码 • if...else if....else 语句 - 使用该语句来选择多个代码块之 一来执行 • switch 语句 - 使用该语句来选择多个代码块之一来执 行
Span和div的区别
Span和div的区别在于：
1）div是一个块级元素，可以包含段落、标题、表格等。 2）Span是行级容器标签，只能包含文字内容。它的前后 不会换行，没有结构的意义，纯粹是应用样式，当其他行 内元素都不适合时，可以使用span。
Css常用属性
样式表的常用属性分为以下几类：
• 我们使用 var 关键词来声明变量：var carname; • 在声明变量时对其赋值：var carname="Volvo"; • 声明新变量时，可以使用关键词 "new" 来声明其类型：var x=new Number;
DIV+CSS工作心得
DIV+CSS工作心得
第一、灵活应变。
DIV+CSS技术不断发展，新技术不断涌现，我们要不断学习，了解
最新的技术和趋势。
客户的需求也随着时间不断变化，我们需要及时调整和处理，力求达
到最佳的效果。
比如，当移动设备开始普及时，我们需要尽快学习响应式设计的技术，开
发适配移动设备的网站。
第二、代码优化。
优化代码的目的是提高网站的性能和用户体验。
我们需要了解网站
的访问时间、页面大小、JS文件大小等数据，寻找优化的空间。
比如，我们可以压缩CSS
代码和JS代码，减小网页的大小，从而提升网站的访问速度。
优化代码也需要考虑兼容性，在测试时要对各种浏览器进行兼容性测试。
第三、跨平台适用。
现在的网站用户使用的设备不仅仅有桌面电脑，还有平板、手机
等移动设备。
我们需要尽可能地多测和多平台开发，确保网站可以在不同的设备和浏览器
上运行良好。
根据用户的不同需求和使用习惯，我们要进行有针对性的CSS开发。
第四、细节处理。
在开发过程中，往往有很多细节需要处理。
这些细节包括按钮、链接、颜色等，虽然看似微小，但在网页用户体验方面却有着不可忽视的作用。
我们要注意
细节处理，从而体现网站的专业性和质量，以及使用户体验更加友好和便捷。
总之，DIV+CSS工作不仅需要技术实力，还需要勇于尝试和学习新技术，优化代码，
跨平台适用和注重细节。
只有在不断学习、不断尝试的基础上，才能更好地满足客户需求，将网站从好到更好的方向发展。
对于div+css+javascript的网页界面设计及优化的点滴学习体会
对于Div+CSS+javascript的网页界面设计及优化的点滴学习体会第二版网站已经基本成型，从CMS转化为全代码团队自己编制，我们经历了很多承受了很多也学到了很多。
而对于界面的设计，我们采用的是div+css+javascript，即层布局+层叠式样式表+网页特效。
在自学Dreamweaver时，刻意避开了div和css，用的是表格布局与框架布局。
那么div 布局与表格布局和框架布局的异同点在哪里呢？从学习比较来看，相同点主要是可以实现网页内容的集中展示，而不是零散的块状网页模块。
简单来说，它们是实现网页布局的三种不同形式。
表格布局与框架布局，如果实践过可以知道，框架布局相当于把整个网页分成几块，分别在这几块里分别进行布局，可以插入表格也可以使用div。
而表格布局与div布局相比，表格布局的优点是，它可以很好地框定网页的结构，可以在可视化的布局环境里随心所欲地调整块状内容，它在各种浏览器中的体现也是正常无误的。
对于初学者而言，表格布局是非常好的选择，同时现有网页中很多是使用表格布局，但是对于网站的后期维护而言，它就会比较浪费时间，维护困难，虽然可以用include外联文件，也只是一个权宜之计。
Div布局的话，它的优点是，通过与css相配合，可以用纯代码控制网页布局，层是可以浮动的。
对于后期的维护而言是十分便利的，现在为主流的网页布局形式。
缺点是很难控制层与层之间的良好位置。
用div布局，css发挥着不可磨灭的作用，在学习使用css之前，曾经问过TB，难不难，他只说了一句话：可以两天学会，关键在怎么应用。
对于css与div的结合，如果懂得它的具体属性，那么网页的布局将是游刃有余的事。
Css主要有背景属性、边框属性（border）、文本属性、字体属性、外边距属性（margin）、内边距属性（padding）、列表属性、内容生成、轮廓、尺寸属性、分类属性、定位属性、伪类、伪元素等。
在我们网页布局时，最最简单的是使用边框属性与内外边距属性。
有关DIV,CSS,Jquery计算机专业毕业实习日记
有关DIV,CSS,Jquery计算机专业毕业实习日记一天即将过去了，你有什么总结呢？不妨坐下来好好写写日记吧。
你所见过的日记应该是什么样的？以下是小编收集整理的有关DIV,CSS,Jquery计算机专业毕业实习日记，仅供参考，大家一起来看看吧。
计算机专业毕业实习日记1在这次的网站建设过程中，我发现自己对于知识不能灵活运用，不能巧妙地结合起来，对代码的不熟悉，这更加是一个大问题。
建站过程中会遇到代码出错，代码位置写错之类的问题，当测试的时候出现了错误但是不能看懂出错原因，只能靠网上搜索。
经常因为一个细小的步骤而出错，做动态网页的时候会遇到更多类似的问题，通常都会花费我很多时间来解决出错原因。
因为不知道出错原因，当请教老师或是同学的时候才恍然大悟，原来是这么简单的。
人往往都是这样，没有经历过的话，永远都不知道事情到底是怎么一个样子，是真的那么难，还是并非如此，所以，不管怎么样，即使是自己完全陌生的事情，只要有机会，都一定要去尝试，努力去做好。
因为没有经验，那么就需要做更多的准备工作。
另外就是不要害怕失败，只要用心去做就可以了。
等到熟练了，那么成功将是水到渠成的事情。
比如我的第一次做那些不起眼的小事时，虽然我做得不够好，但经历了就是好的。
计算机专业毕业实习日记2因为技术部特殊原因，星期六都是轮休，恰好2月11日元宵节到我值班，早上坐车到公司都是一路顺畅，每个人都在家过节，虽然我人在公司，但是心情也跟他们一样，带着元宵节的喜气心情，和着烟花爆竹的声音继续工作。
工作虽没有空闲，但是毕业设计还是要做的，这周又继上周的工作继续向下写。
前面的路还很漫长，需要不断的努力和奋斗才能真正地走好。
计算机专业毕业实习日记3俗话说的好一年之季在于春，一天之季在于晨，又是一个星期的'开始，早上起来呼吸着窗外的新鲜空气，来到厂里开始新的工作，将上个星期的零件图把他装配起来，我以为本来是很简单的事，不过事实并不是想象中的那样的简单，在装配过程中出现了许多问题，这下可把我个弄荤了，都不知道该从何下手，比如说在装配的过程中出现尺寸的不一样，出现很大的间隙等等其他的许多问题。
DIV CSS经验总结
DI V+CSS经验总结1、网页居中显示：需要设置两个地方，一个是body，一个是外边框di v。
CSS：2、文字垂直居中显示：在DIV中定义一个行高与其高度相同即可。
CSS：3、图片垂直居中显示：在<i mg>标签中加入al i gn="absmiddl e"即可。
4、清除浮动：如果在同一行上有几个DIV并列显示，那么必须在其中加入清除浮动代码，如果在一行上只是一个DIV，好象不必清除浮动。
CSS：HTML示例：5、三列结构中的的DIV写法：适用于左右栏是窄幅，中栏为主要内容显示，让其宽度自适应。
CSS：HTML示例：6、textarea在Fi reFox中不能自动换行的处理：有时我们可能会遇到这种现象，在IE中可以自动换行，但在FF中就是不行，即使加了word-break:break-al l;word-warp:warp;也没有效果，怎么回事呢？主要原因是因为我们加入到textarea中的英文字符或代码过长，造成它误识别为一个单词所致。
解决方法也很简单，就是在内容中，人为加一些空格，让FF自动识别为多个单词，从而就能正确换行了。
7、设置<ul>表列缩进值：默认情况下，<ul>列表是缩进两个字符显示列表项目的，我们可以通过设置负边界值达到控制其缩进值的目的。
CSS：默认值是0，负值表示向左移，正值表示向右移。
8、水平导航条的制作示例：HTML代码如下：CSS中，首先清除ul的l i st-styl e、margi n和paddi ng：然后，可以将l i的di spl ay属性设置了i nl i ne或者设置fl oat为l eft，di spl ay l i可能会出现bug，所以我一般用fl oat l eft的方法：附：fi reFox IE css差异1针对Fi refox i e6IE7的Css样式现在大部分都是用!i mportant来hack，对于i e6和fi refox测试可以正常显示，但是ie7对!i mportant可以正确解释，会导致页面没按要求显示！找到一个针对IE7不错的hack方式就是使用“*+Html”，现在用IE7浏览一下，应该没有问题了。
div+css学习总结
在一个元素中不能有两个及以上 id 选择器，但可以有多个 class 选择器
2.8 将类选择器和 id 选择器相同部分的内容整合
2.9 课堂练习
练习 1
html: CSS:
练习 2
html： CSS：
3 块元素和行内元素 3.1 概念
3.2 各自存放的内容及相互转换
4 CSS 核心内容 4.1 流
HtmlPage1.html:
my.css:
2.2id 选择器
my.css:
2.3html 选择器
2.4 综合练习：
HtmlPage1.html: my.css:
第二天
2.5 通配符选择器
2.6 父子选择器
页面效果： HTML: CSS:
2.7id 选择器和类选择器同时修饰
html： CSS： 注：重叠的部分是以 id 的为准，如颜色样式，其他不重叠的部分还要正常显示 class 中的部 分.
（一）
（二）
对应页面：
（一） （二）
4.7 清除浮动 4.8 定位
relative
html CSS
absolute
static
fixed
（只能相对 body 定位）
5 仿 sohu 页面
图片在 div 中居中的方法
小知识：配置 eclipse 模板：
4.2 CSS 的盒子模型
案例：
页面： HTML： CSS：
4.3 盒子模型综合案例
该案例可以当做一个模板来使用，很多大型网站都有用到。
CSS：
HTML：
4.4. 盒子模型练习
CSS：
html
4Байду номын сангаас5 浮动
推荐学习总结--CSS+DIV
CSS+DIVCSS标准CSS(cascading style sheet)，层叠样式表，是用于控制网页样式并允许将样式信息与网页分离的一种标识性语言。
CSS是1996由W3C审核通过，并且推荐使用的。
CSS的引入就是为了使HTML语言更好的适应页面的美工设计。
它以HTML语言为基础，提供了丰富的格式化功能，如字体、颜色、背景和整体排版等，并且网页设计者可以针对各种可视化浏览器（包括显示器、打印机、打字机、投影仪和PDA等）来设置不同的样式风格。
CSS 的引入引发了网页设计一个又一个的新高潮。
使用CSS设计的优秀页面层出不穷。
和HTML类似，CSS也是由W3C组织负责制定和发布的。
1996年12月发布了CSS1.0规范，1998年发5月布了2.0规范。
目前的有两个新版本正处于工作状态，即2.1版和3.0版。
然而，W3C只是一个民间技术组织，并没有任何强制力要求软件厂商的产品必须符合规范，因此目前流行的浏览器都没有完全符合CSS2.0的规范，这也为设计师设计网页带来了不便。
传统HTML的缺点在CSS没有引入页面之前，传统的HTML语言要实现页面美工设计是十分麻烦的。
例如在一个网页中加一个<h2>标签定义的标题，如果要把它设为蓝色，并对字体进行相应的设置，则需要引入<font>标签，如下：<h2><font color=”#0000ff”face=”黑体”>CSS标签1</font></h2>看上去这样的修改并不是很麻烦，但是当页面的内容不仅仅只有一段，而是整个页面时，情况就变的很复杂了。
首先观察如下HTML代码，(01.html)<html><head><tilte>演示</title></head><body><h2><font color="#0000ff"face="幼圆">这是标题文本</font></h2><p>这里是正文内容</p><h2><font color="#0000ff"face="幼圆">这是标题文本</font></h2><p>这里是正文内容</p><h2><font color="#0000ff"face="幼圆">这是标题文本</font></h2><p>这里是正文内容</p></body></html>这段代码在浏览器中的显示效果是，3个标题都是蓝色黑体字，这时如果要将这4个标题改成红色，在这种传统的HTML语言中就需要对每个标题的<font>标签都进行修改，如果是一个规模很大的网站，并且需要对整个网站进行修改的话，那工作量将会是巨大的，甚至无法实现。
css学习总结
css学习总结CSS学习总结在前端开发中，CSS（层叠样式表）是一门非常重要的技术。
它控制着网页的样式和布局，为网页赋予了丰富的外观。
在学习CSS的过程中，我遇到了许多挑战和收获，下面我将总结一下我的学习经验和心得。
一、学习的动力和目标作为一个前端开发者，学习CSS是我工作中不可或缺的一部分。
在我的日常工作中，我经常需要修改和优化页面的样式，所以熟练掌握CSS是非常重要的。
此外，CSS的学习也是我对自己技术水平的提升和追求。
二、基础知识的学习在开始学习CSS之前，我首先学习了HTML的基础知识。
因为CSS 是用来控制HTML元素的样式的，所以对HTML的了解能够帮助我更好地理解CSS的使用。
同时，学习CSS的基础知识也是非常重要的。
我学习了CSS的语法、选择器、属性以及常用布局等内容。
通过不断的练习和项目实践，我逐渐掌握了这些知识。
三、样式设计的原则在学习CSS的过程中，我也注意到了样式设计的原则。
首先，我学会了遵循网页设计的原则，如一致性、对齐、重点突出等。
其次，我学习了响应式设计的思想，使得网页可以在不同的设备上有良好的显示效果。
另外，我也学会了合理运用颜色、字体和背景等元素，以及如何选择适合的布局方式。
通过学习这些原则，我可以设计出更加美观、易用的网页。
四、CSS预处理器和框架的学习除了学习CSS的基础知识和样式设计原则，我还学习了一些CSS预处理器和框架。
比如，我学习了Sass这个非常流行的CSS预处理器，它可以提高CSS的编写效率，同时还可以实现一些高级的功能，如嵌套、变量和混合等。
此外，我还学习了一些CSS框架，如Bootstrap和Foundation等。
这些框架提供了一些现成的样式和组件，可以快速构建出漂亮的网页。
五、不断实践和总结在学习CSS的过程中，我发现实践和总结是非常重要的。
通过不断实践，我可以将学到的知识应用到实际项目中，进一步巩固和加深自己的理解。
同时，在每次实践之后，我都会进行总结和反思，找出自己的不足和需要改进的地方。
CSS学习心得
CSS学习⼼得⼀、先写HTML还是先写CSS？对于⼀个新⼿⽽⾔，在有了⼀点html知识之后，对于CSS、DIV都感觉特别的疑惑，不知道这其中到底是什么联系？为什么⽤了CSS的⽹页不能像其它代码⼀样直观？ html和css哪个先写？其实这些问题在我看完教程，但还没真正上⼿实践时的疑惑！等真正上⼿⾃⼰做时，我才发现应该－－－两者同时写！⼆、把站点建好，⽬录建好，⽐如建好⽂件夹css,images,这两个是最其本的，然后新建⼀个.html空⽂件，⼀个.css空样式表，把.css外部样式表连接到.html 这个⽂件上，链接写在中。
三、写HTML中的最基本的布局部分，都是⽤DIV，然后直接在DIV⾥加⼊ID或CLASS ，这些布局部分包括外套部分，头部分，中间部分，左，中，右，版权部分等.四、到样式表中写各个布局层的样式。
五、写⼀段代码后就进⾏浏览器的测试，同时⽤IE6与FF⼀起测试。
在浏览器中调试，调试时发现许多之前没有预料的问题，如浏览器的兼容问题、浮动的问题等。
六、不断的找出问题、理解怎么出错的，不断的再测试！这样的学习和研究过程，让我体验到了许多次的付出与回报的乐趣，如:第⼀：阅读⼀本书，⼀般来说我第⼀次要先把整个书通读⼀遍，不理解的也要往下看，因为在往下看的过程中也许会找到那个问题的答案，等看完后我会有⼀个⼤概的印象，但⼀定会有很多不明⽩的地⽅，没关系，继续往下看.第⼆：就要边看边做学习笔记了，我有随时写笔记的习惯，电⼦稿或⼿写稿均可。
把⾃⼰认为是重点的部分写上，便于以后查阅；再者，把觉得有疑问的部分记下，带着疑问看下去，如果没有答案，上⽹查询或是问前辈，解疑是提⾼知识最快的⼀种⽅式。
第三：⼼态很重要，⼀定得静下⼼看书，能不越过的看就不越过，要树⽴信⼼，坚持再坚持下去。
系统的将教程学完，⼀遍不⾏两遍，持之以恒。
第四：当你到达终点时你回发现⼀切都是顺理成章的事。
因为你努⼒了，努⼒了就会有回报，有结果.学习永远没有终点，随着学习，知识不断提⾼，所接触的技术领域也随之扩⼤。
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
竭诚为您提供优质文档/双击可除
cssdiv学习心得
篇一：基于css+DIV方式的网页设计的心得体会
基于css+DIV方式的网页设计的心得体会
现在，计算机和网络已经深入到了我们生活中的方方面面，也已经成了生活中不可缺少的一部分，网络成了我们获取知识和信息的一种便捷工具，现在的网民也在不断的增多，所以，了解和学习网络知识是我们作为一名大学生迫切所需的。
我利用这一学期的时间，对网页设计进行了初步的认识和了解。
综合网站技术和设计人员的体会，css+DIV网站建
设具有以下优势和不足，其中css网页布局的优点体现在如下方面：
一、使页面载入得更快
由于将大部分页面代码写在了css当中，使得页面体积容量变得更小。
相对于表格嵌套的方式，DIV+css将页面独
立成更多的区域，在打开页面的时候，逐层加载。
而不像表
格嵌套那样将整个页面圈在一个大表格里，使得加载速度很慢。
二、降低流量费用
页面体积变小，浏览速度变快，这就使得对于某些控制主机流量的网站来说是最大的优势了。
三、修改设计时更有效率
由于使用了DIV+css制作方法，在修改页面的时候更加容易省时。
根据区域内容标记，到css里找到相应的ID，使得修改页面的时候更加方便，也不会破坏页面其他部分的布局样式。
四、保持视觉的一致性
DIV+css最重要的优势之一：保持视觉的一致性；以往表格嵌套的制作方法，会使得页面与页面，或者区域与区域之间的显示效果会有偏差。
而使用DIV+css的制作方法，将所有页面，或所有区域统一用css文件控制，就避免了不同区域或不同页面体现出的效果偏差。
五、更好地被搜索引擎收录
由于将大部分的hTmL代码和内容样式写入了css文件中，这就使得网页中正文部分更为突出明显，便于被搜索引擎采集收录。
六、对浏览者和浏览器更具亲和力
我们都知道网站做出来是给浏览者使用的，对浏览者和
浏览器更具亲和力，DIV+css在这方面更具优势。
由于css 富含丰富的样式，使页面更加灵活性，它可以根据不同的浏览器，而达到显示效果的统一和不变形。
说了这么多css网页布局的优点，同时也不能轻视css 网页布局的副作用：
一、DIV+css尽管不是高不可及，但至少要比表格定位复杂的多，即使对于网站设计高手也很容易出现问题，更不要说初学者了。
二、css网站制作的设计元素通常放在1个外部文件中，或几个文件，有可能相当复杂，甚至比较庞大，如果css文件调用出现异常，那么整个网站将变得惨不忍睹。
三、虽然说DIV+css解决了大部分浏览器兼容问题，但是也有在部分浏览器中使用出现异常，比如火狐浏览器，在Ie中显示正常的页面，到了火狐浏览器中可能会面目全非。
当然这应该是浏览器的问题，但是可以说在目前来看，
DIV+css还没有实现所有浏览器的统一兼容。
四、DIV+css对搜索引擎优化与否,取决于网页设计的专业水平,而不是DIV+css本身。
DIV+css网页设计并不能保证网页对搜索引擎的优化，甚至不能
保证一定比hTmL网站有更简洁的代码设计，何况搜索引擎对于网页的收录和排序显然不是以是否采用表格和css
定位来衡量，这就是为什么很多传统表格布局制作的网站在搜索结果中的排序靠前，而很多使用css及web标准制作的网页排名依然靠后的原因。
因为对于搜索引擎而言，网站结构、内容、相关网站链接等因素始终是网站优化最重要的指标。
综合以上讨论的DIV+css优势和略势，我认为不可盲目跟风，如何更有效、更合理的运用web2.0设计标准，这需
要很长时间的学习和锻炼。
而如何将DIV+css运用的更好，我觉得这需要通过不断的实践和体检，积累丰富的设计经验，才能很好的掌握这门技术。
制作网页是一件很复杂的事，要做好一套网页需要考虑很多方面。
下面就以个人主页的制作来简述一下个人对网页制作的心得与体会。
在制作一套网页之前，首先必须先定位网页的方向，及确定所制作网站的标题。
标题在个人主页中起了很重要的作用，他很大部分的决定了你整套个人主页的定位是否正确，一个好的名字必须有概括性的、简短的、有特色的、容易记得还要符合自己主页的主题和风格，决不要取什么名实不符或则夸大夸大其词的“好名字”，别人第一次上你的当下次
恐怕再也不会光顾了。
选好标题后，开始采集内容，内容必须紧随着标题，在采集内容过程中，很重要的一个“特”色，所谓特色应该是
有一些自己的东西，不能跟平常中所看到的企事业单位的网页相比，个人主页中的特色，应该突出自己独特的个性，把自己的兴趣、爱好尽情的发挥，因为在网络上不受限制，没有人在你的创作内容上指手划脚，品头论足、你的主页就是你在网络上的一个小小家园，在那里你可以放上你自己喜欢的任何东西（当然不是违法的内容、不涉及到版权的），包括你自己平时写的一些文章，一些好听的歌，一段幽默的文章，收集一些好的作品，把这些内容按类别进行分类设置栏目，让人一目了然，在栏目上不要设置太多，最好不要超过十个，层次上最好少于五层，而你的拳头栏目最好能直接从首页到达，保证主页用各种浏览器的都能看到最好的效果。
上面仅仅探讨了几个非常贴近网页制作的形式美的规则，以及在网页中的运用。
如何解决网页中的独特性的问题呢?我想这不仅仅是审美的形式问题,网站要想树立自己的
独特的形象，必须从这些方面入手，把网页上的各种信息的表达统一到网站综合形象的整体里面来考虑。
就会给人留下深刻的独特的形象。
网页制作不只是简单的掌握好制作软件就可以的，还要考虑到网页布局等一系列因素，所以说要想制作好一套网页不是一个人的事，需要与伙伴很好的交流沟通，集合众人之力才能做出出色的网页。
篇二：div+css学习总结。