[05]HTML基础之表格标签

标签：避免   指定   row   跨行   round   更改   html基础   边框   The   

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>

[05]HTML基础之表格标签

标签：避免   指定   row   跨行   round   更改   html基础   边框   The   

原文地址：https://www.cnblogs.com/juetan/p/13027258.html