《DIVCSS工作心得.docVIP

DIV+CSS工作心得 一、头部的定义 1、content=IE=EmulateIE7 这句是把IE8 浏览器强制使用IE7的兼容模式 2、头部的DTD定义要根据需要定义（一般不用管它） DIV布局 1、居中问题：IE通过设置text-align属性为center可以实现，实现居中。 body div id=”wrapper”/div  body  #wrapper { Width:720px; Margin:0 auto; }  2、Div之间默认是会自动换行的，如果要实现不换行就要应用float或借助绝对定位。 、绝对定位问题：如果一个父Div的几个子Div要实现绝对定位，切记父Div的position属性一定要设置为relative，几个子Div的position则设置为absolute。为了实现子Div的精准定位，子Div的高度和宽度都建议明确规定像素大小。外连文件式CSS在网页的〈head〉与〈/head〉之间加上 一句这样的代码：〈link rel=stylesheet href=在这里填上你的CSS文件地址（相对路径+文件名） type=text/css〉 首行缩进“text-indent”右面的缩进单位选择框中“em”指的就是。 虚线内部是内容显示的地方，黄色的地方是算在border里面的，同时背景图片也是计算黄色区域的面积的（padding与背景图片这样经常搭配实现一些效果的）。 CSS样式 CSS权重（优先级） div class=case1 id=case2 style=cloor:red/div style .case2{样式内容} #case2{样式内容} /style 首先权重最高的是页面style样式。然后是ID优先级要高于 CLASS ID是唯一的。 CLASS一个页面可以出现很多个 2、CSS样式重定义 /*CSS样式重定义开始*/ body{ font-size:12px; font-family: Arial, Helvetica, sans-serif;padding:0; margin:0; color:#666666; background:#fff;} div,form,ul,dd,dl,ol,dt,li,p{list-style:none;padding:0; margin:0;} h1,h2,h3,h4,h5,h6{font-size:100%; margin:0; padding:0;} img { border:none; } .none{ display:none;} a{ text-decoration:none; color:#444; cursor:pointer;} a:hover{ color:#FF0000; text-decoration: none;} .clear { width:0; height:0; margin:0; padding:0; line-height:0px; font-size:0px; clear:both; overflow:hidden;} /*CSS样式重定义结束 */ 因为各个浏览器对一些属性的预定义不一样，所以要用到以上是常用的CSS重定义，这样写出的页面才能兼容多个浏览器。（这个很重要！几乎必须要写，可以根据需求修改！） CSS缩写 a) Margin、padding(一样的缩写形式)的缩写如： 顺时针 margin:上 右 下 左 简写： margin:0 auto=margin:0 auto 0 auto; margin:0 auto 10px=margin:0 auto 10px auto; 所以 margin:10px 0 auto;这个就等于margin:10px 0 auto 0; 背景(background) 背景(background)属性可能会包含背景色、背景图、背景图的位置和背景图重复方式的参数background-image: url(“logo.png”); background-position: top center; background-repeat: no-repeat; 其实可以写成:background: url(logo.png) no-repeat top center;Borders(边框) 如果你想声明一个1像素宽的实线黑色边框，可能会写成: border-width:1px; border-style:solid; border-color:#000; 其实可以写成:border:1px solid #000; 文字 文字属性也有很多可能会用到的属性值，像背景一样，你可能会声明这种复杂的文字样式: font-style:ita