CSS - table-layout 屬性



table-layout 屬性允許瀏覽器透過使用遇到的第一個寬度屬性來加快表格佈局的速度,而不是必須載入整個表格才能呈現它。

可能的值

  • auto − 表格應根據某種自動佈局演算法進行佈局。瀏覽器將根據內容計算列和單元格的寬度。

  • fixed − 表格應根據提供的固定表格佈局方法進行佈局。

應用於

所有顯示為 table 或 inline-table 的元素。

DOM 語法

object.style.tableLayout = "fixed";

示例

<html>
<head>
<style>
  table.auto {
    table-layout: auto;
    border-collapse: collapse;
  }
    table.fixed {
    table-layout: fixed;
    border-collapse: separate;
  }
</style>
</head>
<body>
  <div>
    <h2>table-layout: auto</h2>
    <table class = "auto" border = "1" width = "100%">
      <tr>
      <td>1000000000000000000000000000</td>
      <td>10000000</td>
      <td>100</td>
      </tr>
      </table>
      </div>
      <div>
      <h2>table-layout: fixed</h2>
      <table class = "fixed" border = "1" width = "100%">
      <tr>
      <td>1000000000000000000000000000</td>
      <td>10000000</td>
      <td>100</td>
      </tr>
    </table>
  </div>
</body>
</html> 
廣告