巧用CSS提升表格呈現效能

雖然現在div+css很流行，也是標準，但該用table的地方還是要用table，非要用div代替而花費的那個時間很不值，也不符合W3C的標準了.
使用表格版面配置不符合W3C的標準其中之一就是table不能被方便的隨意布局，table的職責用來呈現資料是最理想的，但瀏覽器對table的解釋方式也會成為table在呈現時一個效能上的要點。
預設瀏覽器（IE）會在整個表格都被下載後才開始全部呈現表格，以前用“貓”上網的朋友都有這種體驗，網速慢的時候頁面是一半一半顯示的。有沒有辦法讓table一行一行的顯示呢？CSS裡有一個屬性也許可以滿足你的要求，使表格一行一行的顯示。下面就介紹一下這個屬性：

table-layout
版本：CSS2　 相容性：IE5+　繼承性：無 文法：table-layout : auto | fixed 取值：

auto	:	預設值。預設的自動演算法。布局將基於各儲存格的內容。表格在每一儲存格內所有內容讀取計算之後才會顯示出來
fixed	:	固定式配置的演算法。在這種演算法中，表格和列的寬度取決於 col 對象的寬度總和，假如沒有指定，則會取決於第一行每個儲存格的寬度。假如表格沒有指定寬度( width )屬性，則表格被呈遞的預設寬度為 100% 。

說明：設定或檢索表格的布局演算法。
你可以通過此屬性改善表格呈遞效能。此屬性導致IE以一次一行的方式呈遞表格內容從而提供給資訊使用者更快的速度。此屬性依據此下順序使用其中一種方式布置表格欄寬度：

1. 使用 col 或 colGroup 對象的寬度( width )屬性資訊。
2. 使用表格第一行內的儲存格的寬度( width )資訊。
3. 依據表格列數等分表格寬度。而不考慮表格內容的實際寬度。

假如儲存格的內容超過了列寬度，內容將會被換行。假如無法換行，則內容會被裁切。假如此屬性被設定為 fixed ，則 overflow 能夠被用於控制處理溢出儲存格( td )寬度的內容。假如表格行高度被指定了，那麼換行的內容如果超出了指定表格行高度也會在縱向上被裁切。
設定此屬性值為 fixed ，有助於提高表格效能。對於長表格效果尤其顯著。
設定表格行高可以進一步提高呈遞速度，瀏覽器不需要檢測行內每一個儲存格內容去確定行高就可以開始解析以及呈遞。
此屬性對於 currentStyle 對象而言是唯讀。對於其他對象而言是可讀寫的。
對應的指令碼特性為 tableLayout 。
 樣本：table { table-layout: fixed; } 應用於：

IE5.0+

currentStyleruntimeStylestyleTABLE

固定式配置的演算法比預設的自動演算法要快很多。