布局属性
学习布局所需要的到属性。
1、 display
属性用来设置元素的显示方式。
block 块对象指的是元素显示为一个方块，默认显示状态下将占据整行，其它的元素只能另起一行显示。
inline 行间对象与block刚好相反，它允许其它元素在同一行显示。
none 隐藏对象
div{display:block}
2、float
用来控制元素是否浮动显示。
left 向左浮动
right 向右浮动
none 不浮动
浮动的时候元素的显示属性也变化了 变为 “行内元素”
div{ float:left;}
3、position
position : static | absolute | fixed | relative
static : 无定位，默认值
absolute：绝对定位
relative ： 相对定位
fixed：固定定位
absolute
说明： 脱离文档流。
通过 top,bottom,left,right 定位。
如果父元素 position 为 static 时，将以body坐标原点进行定位。
如果父元素 position 为 relative 时，将以父元素进行定位。
div { position:absolute; left:100px; top:100px;}
总结：
块的特征
1、默认独占一行
2、没有宽度时，默认撑满一排
3、支持所有css命令
内嵌（内联、内行）的特征
1、同排可以继续跟同类的标签
2、内容撑开宽度
3、不支持宽高
4、不支持上下的margin
5、代码换行被解析 //就是相邻的两个内联之间有个空白处
inline-block
1、块在一行显示
2、行内属性标签支持宽高
3、没有宽高的时候内容撑开宽度
4、代码换行被解析 //就是相邻的两个内联之间有个空白处
浮动的定义：使用元素在脱离文档流，按照指定方向发生移动，遇到父级边界或相邻的浮动元素停下来。
浮动的走向是先后顺序，如给3个div内分别加1、2、3，左浮动是1、2、3；
右浮动是3、2、1；因为1先浮动后到2，再到3 ；
当使用p标签时，p的文字会围绕浮动元素，而不是重合，这个是很重要的知识，所以这也达到文字围绕的目的。
浏览器的窗口缩小，字体还是围绕浮动元素，但这时内容变成多段围绕，就像响应式。
对clear属性的设置要放到文字所在的盒子里，例如一个p段落的css设置中，而不要放到对浮动盒子的设置里面。
经常有初学者没有搞懂原理，误以为在对某个盒子设置了float属性以后，要消除它对外面的文字的影响，就要在
它的css样式增加一条clear，其实这是没有用的。
我们要清除的元素相邻的浮动元素的浮动，让浮动影响不了它。
清除浮动，clear：left|right|both|none|inherit
使元素的某个方向上不能浮动。
清除浮动就是浮动元素在浮动时脱离文档流，而文档流的元素会叠到浮动元素下面，
那么浮动元素是那个方向浮动，你就清除那个方向的浮动，就可以不叠在它之下了，
这个经常使用到撑开父级元素中，因为浮动后父级元素会没有浮动元素的高，这样
父级就没有高了，对于某些操作会很麻烦。
子元素有浮动，父元素就包不住它。
清除浮动的方法：
1、加高（扩展性不好）
2、给父级加浮动，但margin左右自动失效（float bad!）
3、inline-block清除浮动（问题margin左右auto失效）
4、空标签清除浮动（ie最小高度19px；（解决后IE6还有2px的偏差））
5、br清除浮动，br标签上有个属性clear（影响w3c标准，不符合工作要求）
6、:after伪类清除浮动
代码：
.clearfix:after{ content:""; display:block; clear:both;}
.clearfix{*zoom:1;} 为ie6、ie7兼容解决的。
7、overflow：hidden；清除浮动,也会出现问题，如不在这个父级范围内的内容，
就无法显示。
relative
position:relative 相对定位
a、不影响元素本身的特性；
b、不使元素脱离文档流（元素移动之后原始位置会被保留）
c、如果没有定位偏移量，对元素本身没有任何影响
d、提升层级
定位元素位置控制
top、right、bottom、left定位元素偏移量
absolute:
a、使元素完全脱离文档流
b、使内嵌支持宽高
c、块属性标签内容撑开宽度
d、如果有定位父级相对于定位父级发生偏移，没有定位父级相对于
document发生偏移
e、相对定位一般都是配合绝对定位元素使用
f、提升层级
z-index:[number]；定位层级
a、定位元素默认后者层级高于前者
b、建议在兄弟标签之间比较层级
fixed 固定定位
与绝对定位的特性基本一致，差别是始终相对整个文档进行定位。
问题：IE6不支持固定定位；
定位其他值：
static 默认值
inherit 从父元素继承定位属性的值（火狐不兼容）
