如果你想,你可以把你的表像,但如果你欣赏的内容是高度语义结构化的我很高兴向您介绍<Thead>元。<Thead>元结构表中的标题,这告诉浏览器的每一列包含什么。< tbody >元结构的全部内容,让浏览器知道该表的实际内容是什么。使用同样的例子之前,<Thead>和< tbody >元素B这样用:
<table border="1" width="100%"> <thead> <tr> <td>Row 1, cell 1</td> <td>Row 1, cell 2</td> <td>Row 2, cell 3</td> </tr> </thead> <tbody> <tr> <td>Row 2, cell 1</td> <td>Row 2, cell 2</td> <td>Row 2, cell 3</td> </tr> <tr> <td>Row 3, cell 1</td> <td>Row 3, cell 2</td> <td>Row 3, cell 3</td> </tr> <tr> <td>Row 4, cell 1</td> <td>Row 4, cell 2</td> <td>Row 4, cell 3</td> </tr> </tbody> </table>
此外,还有一个元素我想介绍给你---<th>元素。这个标签是表格单元标题,是用来代替<td>元素的内容时的细胞是一个标题,而不是实际的电池数据。
这意味着它是显而易见的选择在<thead>元素(应包含如第一行你的表),但你也可以用它来的第一列显示标题,表行标题。
让我们看一个例子,它非常类似于前面的但是我用有意义的内容明确,你如何使用<th>元素。
<table border="1" width="100%"> <thead> <tr> <th>Fruits</th> <th>Vitamin A</th> <th>Vitamin C</th> </tr> </thead> <tbody> <tr> <th>Apples</th> <td>98 ui</td> <td>8.4 mg</td> </tr> <tr> <th>Oranges</th> <td>295 ui</td> <td>69.7 mg</td> </tr> <tr> <th>Bananas</th> <td>76 ui</td> <td>10.3 mg</td> </tr> </tbody> </table>
你可能注意到了,当你尝试自己的例子,你不能看到任何差异。这是因为thead,使,tableheadings只添加semmantic值。但是你总是可以使用CSS样式表,然后这些元素实际上使造型更容易!