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> 
广告