CSS table-layout 屬性
示例
設定不同的表格佈局演算法
table.a {
table-layout: auto;
width: 180px;
}
table.b {
table-layout: fixed;
width: 180px;
}
自己動手試一試 »
定義和用法
table-layout 屬性定義了用於佈局表格單元格、行和列的演算法。
提示： table-layout: fixed; 的主要好處是表格渲染速度更快。對於大型表格，在瀏覽器渲染整個表格之前，使用者將看不到表格的任何部分。因此，如果您使用 table-layout: fixed，使用者將在瀏覽器載入和渲染其餘表格時看到表格頂部。這會給人一種頁面載入速度很快的印象！
瀏覽器支援
表中的數字指定了完全支援該屬性的第一個瀏覽器版本。
| 屬性 | |||||
|---|---|---|---|---|---|
| table-layout | 14.0 | 5.0 | 1.0 | 1.0 | 7.0 |
CSS 語法
table-layout: auto|fixed|initial|inherit;
屬性值
| 值 | 描述 | 演示 |
|---|---|---|
| auto | 瀏覽器使用自動錶格佈局演算法。列寬由單元格中最寬的不換行內容設定。內容將決定佈局 | 演示 ❯ |
| fixed | 設定固定表格佈局演算法。表格和列的寬度由 table 和 col 的寬度或第一行單元格的寬度決定。其他行的單元格不影響列寬。如果第一行沒有寬度，則列寬在表格中平均分配，與單元格內的內容無關 | 演示 ❯ |
| initial | 將此屬性設定為其預設值。閱讀關於initial | |
| inherit | 從其父元素繼承此屬性。閱讀關於inherit |
相關頁面
CSS 教程：CSS 表格
HTML DOM 參考：tableLayout 屬性
