• 行內(nèi)元素 display: inline；

• 塊級元素 display: block；

• 行內(nèi)塊元素 display: inline-block;

• 行內(nèi)元素最好不要包裹塊級元素，但是塊級元素可以任意的包裹行內(nèi)元素；

• 行內(nèi)元素如果其上一個元素也是行內(nèi)元素，則它們會分布在同一條水平線上，即在一行上排列，直到這一行放不下這么多的行內(nèi)元素，它才會另起一行；

• 塊級元素不論上一個元素是行內(nèi)元素還是塊級元素都要另起一行，單獨占一行顯示；

• 對于行內(nèi)元素設置with、height無效，它的寬高只能由它的內(nèi)容撐起來，但對于塊級元素，設置這些值是有效的。

• 行內(nèi)元素設置 上下margin、padding無效，左右有效；

• 塊級元素上下左右margin、padding都有效；

• 行內(nèi)塊元素肩具兩者的特性；

行內(nèi)塊級元素在IE8以下的兼容性：

    div {
           display: inline-block;
           *zoom: 1;
           *display: inline;
   }

注意：

• zoom: 1;作用是在IE下觸發(fā)hasLayout;

• display: inline; 的作用是 一旦觸發(fā)了hasLayout，設置display：inline和display：block效果相似。

記住一個特例：

a標簽無所不能，但它不能包含它自己；