表格布局 | table-layout
表-布局
该table-layoutCSS属性指定用于铺陈算法<table>单元格,行和列。
/* Keyword values */
table-layout: auto;
table-layout: fixed;
/* Global values */
table-layout: inherit;
table-layout: initial;
table-layout: unset;
Initial value | auto |
---|---|
应用对象 | table and inline-table elements |
是否可继承 | no |
媒体 | visual |
计算值 | as specified |
动画类型 | discrete |
规范顺序 | the unique non-ambiguous order defined by the formal grammar |
语法
值
auto
默认情况下,大多数浏览器使用自动表格布局算法。表格及其单元格的宽度将根据内容进行调整。
形式语法
auto | fixed
例
HTML
<table>
<tr><td>Ed</td><td>Wood</td></tr>
<tr><td>Albert</td><td>Schweitzer</td></tr>
<tr><td>Jane</td><td>Fonda</td></tr>
<tr><td>William</td><td>Shakespeare</td></tr>
</table>
CSS
table {
table-layout: fixed;
width: 100px;
border: 1px solid red;
}
td {
border: 1px solid blue;
}
结果
规范
Specification | Status | Comment |
---|---|---|
CSS Level 2 (Revision 1)The definition of 'table-layout' in that specification. | Recommendation | Initial definition. |
浏览器兼容性
Feature | Chrome | Edge | Firefox (Gecko) | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|---|
Basic support | ? - 14.0 + | (Yes) | 1.0 (1.7 or earlier) | 5.0 | 7.0 | 1.0 |
Feature | Android | Chrome for Android | Edge | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|---|---|
Basic support | ? 1.5 | ? | (Yes) | ? | ? | ? 9.8.0 | ? 3.0 |