*知識儲備：
內聯元素：是不可以控制寬和高、margin等；並且在同一行顯示，不換行。
塊級元素：是可以控制寬和高、margin等，並且會換行。
1.inline-block 詳解
（1）一句話就是在CSS中通過display:inline-block對一個對象指定inline-block屬性，可以將對象呈遞為內聯對象，但是對象的內容作為塊對象呈遞。
在CSS中，塊級對象元素會單獨占一行顯示，多個block元素會各自新起一行，並且可以設置width,height屬性；而內聯對象元素前后不會產生換行，一系列inline元素都在一行內顯示，直到該行排滿，對inline元素設置width,height屬性無效。
我們有個時候既希望元素具有寬度高度特性，又具有同行特性，這個時候我們可以使用inline-block
（2）瀏覽器兼容性問題：
那么為了能夠讓所有瀏覽器支持display:inline-block，綜合一下，最終的實現代碼如下：
display:inline-block; /*一方面Firefox3 beta、IE8 beta、Opera、Safari 支持，另一方面下觸發IE下inline 元素的 hasLayout*/
display:-moz-inline-stack; /* Firefox 的私有屬性，需要時還必須用到position:relative解決上面提到的bug */
zoom:1; /*同樣是IE 下觸發 hasLayout*/
*display:inline; /*一旦IE 下觸發了 hasLayout，設置 block 元素為 inline 會使 display:inline 效果與 display:inline-block 相似*/
2.dispaly:inline inline-block block 三者區別精要概括
inline：使用此屬性后，元素會被顯示為內聯元素，元素則不會換行。
block：使用此屬性后，元素會被現實為塊級元素，元素會進行換行。
inline-block：是使元素以塊級元素的形式呈現在行內。意思就是說，讓這個元素顯示在同一行不換行，但是又可以控制高度和寬度，這相當於內斂元素的增強。