HTML教程-HTML<thead>标签
HTML的<thead>标签用于定义HTML表格的表头部分。它通常与<tbody>和<tfoot>标签结合使用,将表格分成不同的部分。
<thead>标签应放置在<table>元素内,并在任何<tbody>、<tr>或<tfoot>元素之前。它应包含一个或多个<tr>(表格行)元素,用于定义表头的每一行。
以下是一个示例,以说明如何使用<thead>标签:
<!DOCTYPE html>
<html>
<head>
<title>HTML Thead标签示例</title>
<style>
table {
border-collapse: collapse;
}
th {
background-color: #ccc;
padding: 10px;
}
</style>
</head>
<body>
<h2>HTML Thead标签示例</h2>
<table>
<thead>
<tr>
<th>姓名</th>
<th>年龄</th>
<th>城市</th>
</tr>
</thead>
<tbody>
<tr>
<td>张三</td>
<td>25</td>
<td>北京</td>
</tr>
<tr>
<td>李四</td>
<td>30</td>
<td>上海</td>
</tr>
</tbody>
</table>
</body>
</html>在上面的示例中,我们使用<thead>标签定义了表格的表头部分,其中包含了姓名、年龄和城市三列的标题。表格的主体部分使用<tbody>标签定义,包含了具体的数据行。
请注意,我们还为表头部分添加了一些CSS样式,以设置背景颜色和填充等样式效果。
属性:
特定于标签的属性:
| 属性 | 值 | 描述 |
|---|---|---|
| align | right、left、center、justify、char | 它确定<thead>元素内部内容的对齐方式。(在HTML5中不支持) |
| char | Character | 它指定<thead>元素内部内容相对于字符的对齐方式。(在HTML5中不支持) |
| charoff | Number | 它指定内容相对于char属性指定的字符对齐方式的字符数。(在HTML5中不支持) |
| valign | top、middle、bottom、baseline | 它确定<thead>元素内部内容的垂直对齐方式。(在HTML5中不支持) |
全局属性:
<thead>标签支持HTML中的全局属性。
事件属性:
<thead>标签支持HTML中的事件属性。
支持的浏览器
| 元素 | Chrome | IE | Firefox | Opera | Safari |
|---|---|---|---|---|---|
<thead> | 是 | 是 | 是 | 是 | 是 |
Chrome
IE
Firefox
Opera
Safari