相信大部分奮戰在前端的，尤其在前端攻城的過程中，有一種越陷越深的感覺，不錯，一如前端深似海，從此妹子是浮雲啊，前端上手容易，深入難啊！下面我就css中的display屬性講下我自己所積累的，與大家共享下，大神勿噴，我只是路過的。
css中display屬性在w3c教程上有簡要說明：當然我是覺得講的不夠詳細，也有部分可能沒深度用過的。
display屬性取值有：block,inline-block;table;inline-table,table-row,table-cell,table-caption;list-item等，這都是基本的用法，相信大家在寫一些彈出框效果的時候用的最多的就是通過display：block和none屬性來顯示與隱藏彈窗。
如:在jquery中可以：
$("#div").css("display":"block");來顯示隱藏想要的doc物件；
1、block與inline-block屬性其實都是塊級元素，不過inline-block乙個是行內的塊級元素；
2、table,table-row,table-cell,table-caption,list-item;
相信大部分的很少去了解這些屬性值，其實這些都是對應的在**table中的對應項跟ul標籤中的li項，其中display:table其實就是乙個table**，而table-row與table-cell分別對應table**中的tr跟td標籤，list-item就是li標籤；其實這些屬性在移動前端開發中用的也挺多的，而且對應的也符合table標籤的一些屬性,如在td中vertical-align用div display:table-cell同樣可以實現，這樣可以幫我們解決一些較前衛的瀏覽器中減少很多不必要的困擾。
ps:如果規定了 !doctype，則 internet explorer 8 （以及更高版本）支援屬性值 "inline-table"、"run-in"、"table"、"table-caption"、"table-cell"、"table-column"、"table-column-group"、"table-row"、"table-row-group"、以及 "inherit"。
還有： 今天同學問我在table元素中想通過js來實現**的一行的隱藏和顯示，結果他用了上述jquery**，結果頁面亂了，後來我用了$("#div").css("display":"table-row");達到了理想效果。
當然還有一些取值，先暫時講這麼多，下次更新，我們來看一些**及效果圖：
源**：
我是**做的
我是div模擬**，不用float喲！！
display和visibility的屬性
display屬性設定元素的顯示方式，對應指令碼特性為display，可選值為none block和inline，各值的說明如下 none 隱藏元素，不保留元素顯示時的空間。block塊方式顯示元素。inline 以內嵌方式顯示元素。visibility屬性設定是否顯示元素，對應的指令碼特性為vis...
CSS中的display屬性
display中文為顯示的意識，顯而易見它的功能就是為了控制頁面元素顯示方式 display中為我們提供了很多屬性，其中最常見的有 none屬性代表著元素不會被顯示 比如很多 的頂部導航欄都會有二級選單，只有當我們的滑鼠移動或點選時二級選單才會顯示出來。這是就可以使用到display none這個屬...
詳解css中的display屬性
首先，所有主流瀏覽器都支援 display 屬性。其次，我們都知道display 屬性規定元素應該生成的框的型別。預設值 inline 我們常用的display屬性值有 inline block inline block none 把 display 設定成 none 不會保留元素本該顯示的空間，但...