xhtml 表 - 正确使用
我有一个非常简单的问题。像示例 1 中那样编写具有 2 个不同标头和重复子标头的表是一个好习惯吗?还是将此代码拆分为 2 个表更好/更具语义(参见示例 2)?
示例 1:
<table>
<tr>
<th colspan="3">HEADER 1</th>
</tr>
<tr>
<th>sub-header 1</th>
<th>sub-header 2</th>
<th>sub-header 3</th>
</tr>
<tr>
<td>data</td>
<td>data</td>
<td>data</td>
</tr>
<tr>
<td>data</td>
<td>data</td>
<td>data</td>
</tr>
<tr>
<th colspan="3">HEADER 2</th>
</tr>
<tr>
<th>sub-header 1</th>
<th>sub-header 2</th>
<th>sub-header 3</th>
</tr>
<tr>
<td>data</td>
<td>data</td>
<td>data</td>
</tr>
<tr>
<td>data</td>
<td>data</td>
<td>data</td>
</tr>
示例 2:
<table>
<tr>
<th colspan="3">HEADER 1</th>
</tr>
<tr>
<th>sub-header 1</th>
<th>sub-header 2</th>
<th>sub-header 3</th>
</tr>
<tr>
<td>data</td>
<td>data</td>
<td>data</td>
</tr>
<tr>
<td>data</td>
<td>data</td>
<td>data</td>
</tr>
</table>
<table>
<tr>
<th colspan="3">HEADER 2</th>
</tr>
<tr>
<th>sub-header 1</th>
<th>sub-header 2</th>
<th>sub-header 3</th>
</tr>
<tr>
<td>data</td>
<td>data</td>
<td>data</td>
</tr>
<tr>
<td>data</td>
<td>data</td>
<td>data</td>
</tr>
</table>
I have a pretty simple question. Is it a good practice to write tables with 2 different headers and repeating sub-headers like in the example 1 or is it better/more semantic to split this code into 2 tables (see example 2) ?
Example 1:
<table>
<tr>
<th colspan="3">HEADER 1</th>
</tr>
<tr>
<th>sub-header 1</th>
<th>sub-header 2</th>
<th>sub-header 3</th>
</tr>
<tr>
<td>data</td>
<td>data</td>
<td>data</td>
</tr>
<tr>
<td>data</td>
<td>data</td>
<td>data</td>
</tr>
<tr>
<th colspan="3">HEADER 2</th>
</tr>
<tr>
<th>sub-header 1</th>
<th>sub-header 2</th>
<th>sub-header 3</th>
</tr>
<tr>
<td>data</td>
<td>data</td>
<td>data</td>
</tr>
<tr>
<td>data</td>
<td>data</td>
<td>data</td>
</tr>
Example 2:
<table>
<tr>
<th colspan="3">HEADER 1</th>
</tr>
<tr>
<th>sub-header 1</th>
<th>sub-header 2</th>
<th>sub-header 3</th>
</tr>
<tr>
<td>data</td>
<td>data</td>
<td>data</td>
</tr>
<tr>
<td>data</td>
<td>data</td>
<td>data</td>
</tr>
</table>
<table>
<tr>
<th colspan="3">HEADER 2</th>
</tr>
<tr>
<th>sub-header 1</th>
<th>sub-header 2</th>
<th>sub-header 3</th>
</tr>
<tr>
<td>data</td>
<td>data</td>
<td>data</td>
</tr>
<tr>
<td>data</td>
<td>data</td>
<td>data</td>
</tr>
</table>
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
根据需要使用尽可能多或尽可能少的表来传达您想要传达的信息,这是更好/更语义的做法。如果您不使用 HTML,并且假设将数据放在一张纸上以便其他人理解,您会使用零个、一个、两个或更多表格吗?这就是您应该使用的表的数量。
It's better/more semantic to use as many or as few tables as you need to convey the information you want to convey. If you weren't using HTML, and say were laying out the data on a sheet of paper for someone else's understanding, would you use zero, one, two or more tables? That's how many tables you should use.