CSS相关

1.盒子3D模型(5层):border、content+padding、background-image、background-color、margin

2.CSS布局模型:绝对定位(absolute)、相对定位(relative)、固定定位(fixed,与background-attachment:fixed功能相同)

3.定宽块状元素水平居中:用margin-left/right:auto;

不定宽块状元素水平居中:加table标签,display:inline ;table{margin:0 auto;};

设置position:relative和left:50%;

自动居中,设置包裹层,如:#a{width:200px;margin:0 auto;},auto会根据浏览器的宽度自动的设置外边距,外边距=(浏览器的宽度-外包含层的宽度)/2

如果想让页面自动居中,设置margin:auto后不能再设置浮动或绝对定位属性

4.设置了浮动的元素,仍旧处于标准文档流中,仍占据空间。

5.横向两列布局:relative——父元素相对定位(固定宽度列)

absolute:自适应宽度元素绝对定位

注意:固定宽度列的高度>自适应宽度的列

5.fixed定位——绝对定位:脱离文档流,位置固定不变,兄弟元素会从其下穿过

未设置偏移量:有已定位祖先元素:以祖先元素为基准定位;无已定位祖先元素:以浏览器窗口为基准定位

已设置偏移量:有无已定位祖先元素,均以浏览器窗口为基准偏移。

 

posted @ 2016-06-05 12:12  薄小冰  阅读(115)  评论(0编辑  收藏  举报