欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

HTML中的table表格标签

程序员文章站 2022-04-29 18:29:49
...

HTML中的table表格标签

table:表格标签;包括“thead”,“tbody”两个部分。

thead标签:表示表格头部,里面包含“tr”行标签,“tr”里面包含“th”列标签。

tbody标签:表示表格内容部分,其中包括“tr”行标签,“tr”里面的“td”列标签。

td,th标签共同的属性:“colspan”合并列,“rowspan”合并行。

<table border="1px" cellspacing="0"><!--border:表示边框1像素 ,cellspacing="0"表示表格之间的距离为0>-->
    <thead><!--代表表头-->
        <tr><!--行-->
            <!--colspan:合并列,删除多余列-->
            <th colspan="2">工作表</th><!--表头里面的列-->
        </tr>
    </thead>
    <tbody><!--表内容-->
        <tr>
            <!--rowspan:合并行,删除多余行-->
            <td rowspan="2">111</td><!--表内容里面的列-->
            <td>222</td>
        </tr>
        <tr>
            <td>222</td>
        </tr>
    </tbody>
</table>

加上cellspacing运行结果显示图:
HTML中的table表格标签

没加上cellspacing运行结果显示图:

HTML中的table表格标签

掌握以上的基础就可以编辑出以下的表格:
HTML中的table表格标签
需要最后表格的文件可以到我的资源里面下载哦~我的主页