笔记1：内联元素和块状元素 浮动和定位

内联元素和块状元素

块元素：1. 类似于一个容器，可以容纳其他的块状元素和内联元素
2. width 和 height 起作用
3. 排斥其他元素和他排在同一行

块元素的种类：div ul li dl dt dd p

内联元素：1. 只能容纳文本或者其他的内联元素
2. 可以与其他的内联元素排在同一行
3. width 和 height 不起作用
4. 如果要使内联元素的width和 height起作用， 通过设置display：block

内联元素的种类：a img

浮动和定位

浮动： 将两个个块状元素设置为float ， 可以使这两个块状元素排在同一行。
在IE中有一个bug，只要同时满足这三个条件：1. 块状元素 2. 设置了float：left 3. margin-left 不为0.
这时在IE中margin-left会 double。
为了消除这个bug，通过将产生double效果的元素设置为 display：inline
而且 width和 height 依然起作用。

如果两个块状元素都设置为float了，这时增加一个块状元素div3，IE中，div3会排在后面，而在chrome中，div3会被float元素覆盖住。
解决：通过在前两个元素和div3之间增加一个div，并设置为clear：both。
这样div3就会重新另起一行