CSS3的chapter6
CSS布局
div标签：
在css布局方式中，div 是这种布局方式的核心对象，我们的页面排版不再依赖于表格， 仅从div的使用上说，做一个简单的布局只需要两样东西：div 与 css.因此我们称这种 布局方式为 div + css 布局。
文档流：
文档流其实就是指浏览器生成页面的顺序。也是浏览器默认的显示规则。
Display（元素显示模式）：
用来设置元素的显示方式。
|
display |
|
|
block |
块对象指的是元素显示为一个方块，默认显示状态下将占据整行，其它的元素只能另起一行显示。 |
|
inline |
行间对象与block刚好相反，它允许其它元素在同一行显示 |
|
inline-block |
既有行内元素的特点，又有块级元素的特点 |
|
none |
隐藏对象 |
Float（元素的浮动）
用来控制元素是否浮动显示。
|
Left |
向左浮动 |
|
right |
向右浮动 |
|
none |
不浮动 |
浮动的时候元素的显示属性也变化了 变为 “行内元素”
Clear（清除浮动）
|
none |
默认值，允许浮动 |
|
left |
不允许左边浮动 |
|
right |
不允许右边浮动 |
|
both |
不允许浮动 |
position（元素定位）
|
static |
默认值，无定位 |
|
absolute |
绝对定位 |
|
relative |
相对定位 |
|
fixed |
固定定位 |
Absolute：
l 脱离文档流。
l 通过 top,bottom,left,right 定位。
l 如果父元素 position 为 static 时，将以body坐标原点进行定位。
如果父元素 position 为 relative 时，将以父元素进行定位。
Relative：
l 相对定位（相对自己原来的位置而言）
l 不脱离文档流
l 参考自身静态位置通过 top,bottom,left,right 定位。
Fixed：
固定定位实际上只是绝对定位的特殊形式；固定定位的元素是相对于浏览器窗口而固定， 而不是相对于其包含元素；即使页面滚动了，它们仍然会处在浏览器窗口中跟原来完全一样的地方。
z-index（元素的层叠关系）
当元素发生重叠时，可以通过 z-index 属性，设置其层叠的先后顺序。 较大 number 值的对象会覆盖在较小 number 值的对象之上。
默认值为0.
CSS reset（清除默认样式）
在HTML标签在浏览器里有默认的样式，在切换页面的时候，浏览器的默认样式往往会给我们带来麻烦，影响开发效率。解决的方法就是一开始就将浏览器的默认样式全部去掉，更准确说就是通过重新定义标签样式。"覆盖"浏览器的CSS默认属性。也就是把浏览器提供的默认样式覆盖掉！
