5. BOX模型在firefox和IE中的解释相差2px的解决方法
div{margin:30px !important ; margin:28px;}
现在进行WEB重构的时候,一般我们做DIV 居中是这样:
body{
margin:0px auto;
text-align:center;
}
但是在没申明下面这句解析方法的时候,页面就会出错.不能居中对齐!
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
另一种兼容方法
<style type="text/css"> /*去除body的内外填充和border*/ body{ border:0 none; margin:0;/*外填充*/ padding:0; background-color: #FFF; } p{ margin:0; /*去掉外填充,否则FF下外填充会向外透滲,外填充会穿透外层,是透明的但占用空间, 2个P的margin重叠不多占空间*/ } #page { background-color:#AABFAA; margin:0 auto; /*设置上下外填充为0,左右自动(居中)*/ overflow:visible; width:950px; } </style> </head> <body> <div id="page"> <p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p> <p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p> <p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p> <p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p> <p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p> <p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p><p>p</p> </div> </body>
6.CSS中的布局属性的理解
display div:block(此元素将显示为块级元素,前后会带有换行符。) span:inline
float:相对于父元素的浮动 设置了float为left或者right的元素A的display属性自动转为block
***跟随浮动对象的对象B将移动到浮动对象A的位置(暂时理解为float对象A前后不换行了)。
假如在一行之上只有极少的空间可供浮动元素A,那么这个元素A会跳至下一行
clear:B设置了clear:both 为B增加上外边距(***)。这样B才能位于A的下外边距边界之下
http://www.cnblogs.com/woodfish1988/archive/2007/03/01/660335.html