html特殊表格(colspan,rowspan)

最新推荐文章于 2023-03-29 12:08:39 发布

国产野马

最新推荐文章于 2023-03-29 12:08:39 发布

阅读量3.4k

点赞数 1

分类专栏： html 表格合并文章标签： html 合并标签

html 同时被 3 个专栏收录

4 篇文章 0 订阅

订阅专栏

表格

1 篇文章 0 订阅

订阅专栏

合并

1 篇文章 0 订阅

订阅专栏

本文详细介绍了HTML中如何使用colspan和rowspan属性来合并表格单元格。colspan属性用于指定单元格横向跨越的列数，而rowspan属性则用于指定单元格纵向跨越的行数。通过具体的代码实例展示了如何实现单元格的合并。

摘要由CSDN通过智能技术生成

colspan和rowspan这两个属性用于创建特殊的表格。

colspan用来指定单元格横向跨越的列数：colspan就是合并列的，colspan=2的话就是合并两列。

rowspan用来指定单元格纵向跨越的行数:rowspan就是用来合并行的，比如rowspan=2就是合并两行，

rowspan通常使用在td和th标签中
row:行,span:跨度,跨距,范围
col:列,span:跨度,跨距,范围

<body>
<table border="1" width="300">
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
    </tr>
    <tr>
        <td>4</td>
        <td>5</td>
        <td>6</td>
    </tr>
</table>
</br>
<table border="1" width="300">
    <tr>
        <td colspan=3>合并第一行的三列</td>
    </tr>
    <tr>
        <td>4</td>
        <td>5</td>
        <td>6</td>
    </tr>
</table>
</br>
<table border="1" width="300">
    <tr>
        <td rowspan="2">合并第一列的两行</td>
        <td>2</td>
        <td>3</td>
    </tr>
    <tr>
        <td>5</td>
        <td>6</td>
    </tr>
</table>
</body>