下輩子我要做你的一顆牙，至少，我難受，你也會疼
display:inline;與float:left;的用途區別
首先我們要明確，display:inline;與float:left;正確含義。display:inline;(內聯)《CSS權威指南》中文字顯示：任何不是塊級元素的可見元素都是內聯元素。其表現的特性是“行佈局”形式，這裏的“行佈局”的意思就是說其表現形式始終以行進行顯示。比如，我們設定一個內聯元素border-bottom:1px solid #000;時其表現是以每行進行重複，每一行下方都會有一條黑色的細線。如果是塊級元素那麼所顯示的的黑線只會在塊的下方出現。
當然這看起來不像是display:inline;與float:left;的區別所在，但是當理解了float:left;的特性那麼我們就清楚到底是怎麼回事了。float:left;(左浮動)他使得指定元素脫離普通的文檔流而產生的特別的佈局特性。並且FLOAT必需應用在塊級元素之上，也就是說浮動並不應用於內聯標籤。或者換句話來說當應用了FLOAT那麼這個元素將被指定爲塊級元素。
那麼我們很清楚了，內聯(display:inline;)元素不能設置寬高，因爲內聯屬於行佈局，其特性是在一行裏進行佈局，所以不能被設定寬高。
——————————————————————————————————————————
display顯示屬性允許使用四個值中的一個來定義一個元素:
block (在元素的前和後都會有換行)
inline (在元素的前和後都不會有換行)
list-item (與block相同, 但增加了目錄項標記)
none (沒有顯示)
對於下列元素來說，此屬性的默認值爲 block ：
ADDRESSQUOTE BODY XMP CENTER COL COLGROUP DD DIR DIV DL DT FIELDSET FORM Hn HRIFRAME LEGEND LISTING MARQUEE MENU OL P PLAINTEXT PRE TABLE TD TH TR UL
對於下列元素來說，此屬性的默認值爲 none ：
BR FRAME nextID TBODY TFOOT THEAD
對於下列元素來說，此屬性的默認值爲 list-item ：
LI
其他元素默認值都是 inline 。
display:inline的用法
display:inline可以讓行內顯示爲塊的元素，變爲行內顯示。例如：
<div> DIV1 </div>
<div> DIV2 </div>
這裏DIV1和DIV2分別佔一行，但是你給他們加上屬性後：
<div style= "display:inline "> DIV1 </div>
<div style= "display:inline "> DIV2 </div>
DIV1和DIV2這時候顯示在同一行了。
和display:inline 對應的是display:block，block ， 會讓應用了該CSS 屬性的HTML 標記變成塊級別元素。例如SPAN 是行內顯示的，但是你加了display:block 屬性就不一樣：
<span style= "display:block "> SPAN1 </span>
<span style= "display:block "> SPAN2 </span>
display:inline比較經典的用法是用在<ul> 下的<li> 中
內聯
block一般一個塊佔一行，除非float
inline是自動排爲一行，就象段內的文字一樣，可成爲多行。
display:inline 的作用是設置對象做爲行內元素顯示。
inline是內聯對象的默認值（ps:內聯對象就是不自動產生換行的元素，比如span），而我們一般用的div是塊級元素，默認display屬性是block。
但將div的display設置爲inline的話，則多個div可以象span一樣顯示在一行了。
display的另一些屬性
block : CSS1 塊對象的默認值。將對象強制作爲塊對象呈遞，爲對象之後添加新行。
none : CSS1 隱藏對象。與visibility 屬性的hidden值不同，其不爲被隱藏的對象保留其物理空間
inline : CSS1 內聯對象的默認值。將對象強制作爲內聯對象呈遞，從對象中刪除行。
inline-block : IE5.5 將對象呈遞爲內聯對象，但是對象的內容作爲塊對象呈遞。旁邊的內聯對象會被呈遞在同一行內。
compact : CSS2 未支持。分配對象爲塊對象或基於內容之上的內聯對象。
marker : CSS2 未支持。指定內容在容器對象之前或之後。要使用此參數，對象必須和:after 及:before 僞元素一起使用。
inline-table : CSS2 未支持。將表格顯示爲無前後換行的內聯對象或內聯容器
list-item : CSS2 將塊對象指定爲列表項目。並可以添加可選項目標誌
table-caption : CSS2 未支持。將對象作爲表格標題顯示
table-cell : CSS2 未支持。將對象作爲表格單元格顯示
table-column : CSS2 未支持。將對象作爲表格列顯示
table-column-group : CSS2 未支持。將對象作爲表格列組顯示
table-header-group : CSS2 將對象作爲表格標題組顯示
table-footer-group : CSS2 將對象作爲表格腳註組顯示
display:inline 對應不顯示爲display:none
display:block 對應不顯示爲hidden
說通俗點樣式爲none的元素不佔位置,而樣式爲hidden的元素雖然不顯示但還是佔地方。
