HTML <table> 标签的 rules 属性 详解
HTML基础 2023-07-13 19:03:32小码哥的IT人生shichen
HTML <table> 标签的 rules 属性
实例
下面的例子规定只有行之间的边框是可见的：
<table rules="rows">
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
</table>
完整实例【亲自试一试】：
<html>
<body>
<p><b>注释：</b>rules 属性无法在 Internet Explorer、Chrome 或者 Safari 中正确地显示。</p>
<p>Table with rules="rows":</p>
<table rules="rows">
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
</table>
<p>Table with rules="cols":</p>
<table rules="cols">
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
</table>
<p>Table with rules="all":</p>
<table rules="all">
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
</table>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
浏览器支持
rules 属性在 Firefox 和 Opera 中可以正确地显示。
Internet Explorer、Chrome 以及 Safari 3 对该属性的显示并不正确。
- IE: 除了内侧边框，还会添加 4 边的外侧边框。
- Chrome 和 Safari：除了内侧边框，还会添加 affected 外侧边框。
注释：Safari 2.0 和更早的版本不支持该属性。
语法
<body rules="value">
属性值
| 值 | 描述 |
|---|---|
| none | 没有线条。 |
| groups | 位于行组和列组之间的线条。 |
| rows | 位于行之间的线条。 |
| cols | 位于列之间的线条。 |
| all | 位于行和列之间的线条。 |
