[05]HTML基础之表格标签

1. <table>标签

表格容器,尽量避免用属性书写样式,而是用CSS来表达

border: 数字 //表格边框宽度

2. <caption>标签

表格的标题,一般出现在表格上方,可通过CSS更改方向

3. <tr>标签

表示表格的一行。

4. <th>标签

表头的一个单元,与<tr>相比,一般做一列的标题,不展示内容

5. <tr>标签

表格的一个单元,表格的最小单位

6. <col>标签

表示当前所占的列数,用于应用CSS样式,span属性指定应用样式的列数。span:横跨的列数

7. <colgroup>标签

<col>标签进行分组。

8. <thead>标签

表示表格的头部

9. <tbody>标签

表示表格的主体

10. <tfoot>标签

表示表格的脚部

由于表格标签并不单独使用,这里放在一起做个集合。这些标签有许多属性,但大部分都是关于布局之类的,而这些属性实现的效果,用CSS也可以实现。所以,在html5之后,已经不推荐使用这些属性。

<!-- 表格容器 border:表格边框 --><table border> <!-- 表格标题 --> <caption>用户</caption> <!-- 列容器 --> <colgroup> <!-- 应用CSS样式的列 span:列数 --> <col style="background:#f60"></col> <col style="color:#f60"></col> </colgroup> <!-- 表格头部 --> <thead> <!-- 表格一行 --> <tr> <!-- 头部单个单元格 --> <th>姓名</th> <th>年龄</th> </tr> </thead> <!-- 表格主体 --> <tbody> <tr> <!-- 主体单个单元格 colspan:横跨列数 rowspan:横跨行数 --> <td>张三</td> <td>18</td> </tr> </tbody> <!-- 表格底部 一般用于统计之类 --> <tfoot> <tr> <th>1个</th> <th>2项</th> </tr> </tfoot></table>

相关文章