一、為什麼不用table系**元素？
目前，在大多數開發環境中，已經基本不用table元素來做網頁布局了，取而代之的是div+css，那麼為什麼不用table系**元素呢？
1、用div+css編寫出來的檔案k數比用table寫出來的要小，不信你在頁面中放1000個table和1000個div比比看哪個檔案大
2、table必須在頁面完全載入後才顯示，沒有載入完畢前，table為一片空白，也就是說，需要頁面完畢才顯示，而div是逐行顯示，不需要頁面完全載入完畢，就可以一邊載入一邊顯示
3、非**內容用table來裝，不符合標籤語義化要求，不利於seo
4、table的巢狀性太多，用div**會比較簡潔
二、但我想要乙個**的布局方式怎麼辦？
好處很多，但是有的專案中又需要類似**的布局怎麼辦呢？可以用display:table來解決
display:table系列幾乎是和table系的元素相對應的，請看下表：
table
（類似 ）此元素會作為塊級**來顯示，**前後帶有換行符。
inline-table
（類似 ）此元素會作為內聯**來顯示，**前後沒有換行符。
table-row-group
（類似 ）此元素會作為乙個或多個行的分組來顯示。
table-header-group
（類似 ）此元素會作為乙個或多個行的分組來顯示。
table-footer-group
（類似 ）此元素會作為乙個或多個行的分組來顯示。
table-row
（類似 ）此元素會作為乙個**行顯示。
table-column-group
（類似 ）此元素會作為乙個或多個列的分組來顯示。
table-column
（類似 ）此元素會作為乙個單元格列顯示。
table-cell
（類似 和 ）此元素會作為乙個**單元格顯示。
table-caption
（類似 ）此元素會作為乙個**標題顯示。
「display:table;」的css宣告能夠讓乙個html元素和它的子節點像table元素一樣。使用基於**的css布局，使我們能夠輕鬆定義乙個單元格的邊界、背景等樣式，而不會產生因為使用了table那樣的製表標籤所導致的語義化問題。
display:table能解決哪些問題？
（1）大小不固定的元素垂直居中
父元素設定：display:table; 子元素：display:table-cell; vertical-align:middle;
（2）兩列自適應布局
（3）等高布局
display table 使用小結
ie8支援很多新的css display屬性值，包括與 相關的屬性值 table table row和table cell，它也是最後一款支援這些屬性值的主流瀏覽器。它標誌著複雜css布局技術的結束，同時也給了html 布局致命一擊。最終，使用css布局來製作出類似於table布局的柵格將會變得十分...
display table布局總結
1.table布局方式 2.table布局實際應用 效果 列表布局，等空隙 grid row image style head body h3 子容器自動平分寬度 即使設定寬度，也會進行自動等分，自適應父容器的寬度 h3 div class table demo1 div class box1 ta...
display table的幾個用法
div css的布局已經讓 布局幾乎很少用到，除非 語義性很強的情況。display table解決了一部分需要使用 特性但又不需要 語義的情況，尤其是div css很不方便解決的問題，比如以下兩種情況 一 父元素寬度固定，想讓若干個子元素平分寬度 通常的做法是手動設定子元素的寬度，如果設定百分數不...