資訊專欄INFORMATION COLUMN
摘要：瀏覽器默認樣式中規定了元素哪些屬于塊剩下的就是流。上圖可知，針對的標簽，你設置寬度和高度是無效的，通過監控可以知道，該元素實際的寬度和高度都是，并不是我們設定的值。因此，的特點可以總結為外部看來是流，但是自身卻是一個塊。
1.引言
html元素，除了“塊”就是“流”（即平時常說的塊級元素和行內元素），而且“流”都包含在“塊”中，例如body就是一個“塊”，而a就是一個“流”。瀏覽器默認樣式中規定了html元素哪些屬于“塊”（剩下的就是“流”）。
其實，這部分知識都囊括在display這個樣式設置中。在網上查找出display所有的屬性，你會發現它有很多，但是不是每個都常用，甚至大部分你都沒有用過。這個沒關系，學以致用，用不到的就可以先不學，知道就行，什么時候用，什么時候再去詳細學——前提是你知道有這么個東西，否則無從下手。
常用的有：none、block、inline、inline-block、list-item、table、table-cell、inherit，有些已在《瀏覽器默認樣式》中講過，簡單描述如下：
list-item：用于模擬li列表樣式；
table：也是一個“塊”，但和block相比，table具有包裹性；
table-cell：用于模擬表格單元格（類似table中的
inherit：從父元素繼承display屬性的值。
接下來介紹其他幾個常用的display值。
2.inline常用的inline就是文字和圖片，其實inline真沒什么好說的，大家可以把它想象成一個杯子里的水，它是“流”，是沒有大小和形狀的。
Hello World!
上圖可知，針對inline的標簽，你設置寬度和高度是無效的，通過監控可以知道，該元素實際的寬度和高度都是auto，并不是我們設定的值。
那么，如何把inline元素轉換成“塊”元素呢？
最簡單的是設置display:block;或display:table;
還有兩種方式應該了解：
第一，對inline元素設置float還是剛才那個例子，我們對span元素添加一個float:left，運行看看效果：
Hello World!
從顯示的效果和監控的結果上看來，span元素已經“塊”化。注意，上一節剛剛講完float，不要忘記float的“破壞性”、“包裹性”，在這里同樣適用。
第二，對inline元素設置position:absolute/fixed還是有同一個例子做演示，這次在span元素上加上absolute/fixed，效果大家應該能猜到，和加上float的效果相同。至于absolute/fixed有什么特性，會在下一節介紹position時提到。
Hello World!
3.block
其實對于block，我覺得就是“盒子模型”。一個元素設置了block，它就必須遵循盒子模型的規則。因此，這里也不再去詳細寫它了，大家可以去盒子模型那一節好好看看，就那么點內容。
4.inline-block瀏覽器默認樣式中規定了幾個html元素為display:inline-block;。
首先，你應該知道inline是什么樣子的，就是一般的文字、圖片；其次，你應該知道block是什么樣子的，一般的div就是；最后，inline-block顧名思義，它既有inline的特性，又有block的特性，大家可以想想一般的button、input是什么樣子的。
我們在頁面中輸入若干個