1、display:inline-block

讓一個元素具有“區(qū)塊元素”的屬性（可以設(shè)置width和height），又具有“內(nèi)聯(lián)元素”的屬性（不產(chǎn)生換行）。

2、IE中的inline-block

IE6不支持這個屬性，但I(xiàn)E8開始支持這個屬性。

讓IE6內(nèi)聯(lián)元素具備inline-block特性

由于inline-block會觸發(fā)IE的layout，所以IE6中只要設(shè)置{display:inline-block;}即可。

讓IE6區(qū)塊元素具備inline-block屬性，有兩種方法

A、可以先觸發(fā)layout，再設(shè)置為inline，需要注意的是這兩個display必須在兩個CSS聲明中才有效，代碼如下：

div {
width:400px;
height:200px;
display:inline-block;
}
div {
display:inline;
}

B、直接設(shè)置為inline，再利用zoom來觸發(fā)layout來實現(xiàn)類似效果：

div {
width:400px;
height:200px;
*display:inline;
*zoom:1;
}

3、其它瀏覽器

其它瀏覽器都支持這個屬性，但Firefox從3.0才開始支持這個屬性，對于之前的版本可以利用其私有屬性{display:-moz-inline-box}來實現(xiàn)類似效果，但也可以忽略3.0之前的版本（這些版本的瀏覽器很少有人使用了）。

CSS{display:inline-block}

2002年W3C推出CSS2.1規(guī)范時，給元素的display屬性增加了inline-block值。其作用是“這個值導(dǎo)致一個元素產(chǎn)生一個塊狀盒模型（block box），而本身作為單一的內(nèi)聯(lián)盒模型（inline box）流動排列（flow），類似一個被替代的元素。Display值為inline-block的元素內(nèi)部形成一個塊狀盒模型，而本身形成類似一個內(nèi)聯(lián)的被替代元素”[1]。即display為inline-block的元素既可以像塊狀元素一樣定義高度寬度，又可以和內(nèi)聯(lián)元素（比如文字）排列在一行。

這個效果在頁面設(shè)計的時候，很多地方都可以帶來便利，最常見的莫過于設(shè)計導(dǎo)航時，既可以像inline元素那樣實現(xiàn)居中，又可以設(shè)置像block元素那樣設(shè)置單個菜單大小，還可以通過text-indent來隱藏文字顯示背景圖片。請看 演示實例>>>>。

1.Opera和Safari支持這個屬性。
2.IE不支持這個屬性IE8 beta1支持這個屬性，但inline-block會觸發(fā)IE的layout，從而使內(nèi)聯(lián)元素具有類似inline-block元素的屬性。cross-browser : display:inline-block是一個很好的例子。
對于display:block的元素，要實現(xiàn)類似inline-block的效果，可以先觸發(fā)layout，再設(shè)置為inline，需要注意的是這兩個display必須在兩個CSS聲明中才有效，代碼如下：

.pagination li{
display:inline-block;
}
.pagination li{
display:inline;
}

或者直接設(shè)置為inline，再利用zoom來觸發(fā)layout來實現(xiàn)類似效果：

.pagination li{
display:inline;
zoom:1;
}

3.Firefox也不支持這個，這個是蠻意外的事情，F(xiàn)irefox3應(yīng)該會支持吧，F(xiàn)irefox3 beta2上已經(jīng)正式支持，在這之前可以利用其私有屬性{display:-moz-inline-box}來實現(xiàn)類似效果是一個不錯的選擇[2]。