元素显示模式
display : block | none | inline | inline-block
display 属性用来设置元素的显示方式。
block块对象指的是元素显示为一个方块，默认显示状态下，它将占
据整行，其它的元素只能在下一行显示。
inline行间对象与block刚好相反，它允许其它元素在同一行显示。
none隐藏对象
元素的浮动
float : none | left | right
float 属性用来控制元素是否浮动显示。
left向左浮动
right向右浮动
none不浮动
浮动的时候元素的显示属性也变化了 变为 "行内元素"
Css 布局
div 标签：
<div> </div>
div 与其它标签一样，也是一个XHTML所支持的标签。
div 是XHTML中指定的，专门用于布局设计的容器标签。
在css布局方式中，div 是这种布局方式的核心对象，我们的页面排版不再依赖于表格，仅从div的使用上说，做一个简单的布局只需要两样东西：div 与 css.因此我们称这种布局方式为 div + css 布局。
<div id="header">页面头部</div>
<div id="content">
<div id="left"></div>
<div id="right"></div>
</div>
<div id="footer">页脚</div>
盒模型就是指CSS布局中的每一个元素，在浏览器的解释中，都被当作一个盒状物。
对我们来说，只需要理解元素在页面中所占据的位置。
ie6 / ie7 / firefox 的最终宽度 =左边框宽 + 左内边距 + 宽度 + 右内边距 + 右边框宽
文档流
文档流是浏览器解析网页的一个重要概念，对于一个XHTML网页，body 元素下的任意元素，根
据其前后顺序，组成了一个个上下关系，这便是文档流。浏览器根据这些元素的顺序去显示它
们在网页中的位置。
文档流是浏览器的默认显示规则。
深入浮动
浮动的目的
就是要打破文档流的默认显示规则。如果要让元素按照我们的布局要求进行显示。这时就要利
用float属性。
1.任何申明为 float 的元素自动被设置为一个"块级元素"。
2.在标准浏览器中 浮动元素脱离了文档流 ，所以浮动元素后的元素会占据浮动元素本来应该
所处的位置。
3.如果水平方向上没有足够的空间容纳浮动元素，则转向下一行 。
4.文字内容会围绕在浮动元素周围 。
5.浮动元素只能浮动至左侧或者右侧 。
清除浮动
clear : none | left | right | both
none :默认值。允许两边都可以有浮动对象
left :不允许左边有浮动对象
right: 不允许右边有浮动对象
both :不允许有浮动对象