html中的单元格的合并

最新推荐文章于 2025-05-27 13:07:55 发布

onlyxufeifei

最新推荐文章于 2025-05-27 13:07:55 发布

阅读量7.9k

点赞数 4

CC 4.0 BY-SA版权

分类专栏：编程语言

本文链接：https://blog.youkuaiyun.com/onlyxufeifei/article/details/80872783

编程语言专栏收录该内容

5 篇文章

订阅专栏

本文详细介绍了HTML中表格单元格的合并方法，包括横向合并(colspan)与纵向合并(rowspan)的具体使用方式，并通过实例展示了如何调整表格布局。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

colspan是横向合并 rowspan是纵向合并

    	<table   border="1"  style="width: 500px;height:400px">
       <tr>
         <td ></td>
         <td></td>
         <td></td>
       </tr>
       <tr>
         <td></td>
         <td></td>
         <td></td>
       </tr>
       <tr>
         <td></td>
         <td></td>
         <td></td>
       </tr>
     </table>

显示为

<table   border="1"  style="width: 500px;height:400px">
       <tr>
         <td  colspan="3" ></td>
       </tr>
       <tr>
         <td></td>
         <td></td>
         <td></td>
       </tr>
       <tr>
         <td></td>
         <td></td>
         <td></td>
       </tr>
     </table>

<table   border="1"  style="width: 100px;height:100px">
       <tr>
         <td  colspan="2" ></td>
         <td></td>
       </tr>
       <tr>
         <td></td>
         <td></td>
         <td></td>
       </tr>
       <tr>
         <td></td>
         <td></td>
         <td></td>
       </tr>
     </table>

rowspan的作用是指定单元格纵向跨越的行数。

    	<table   border="1"  style="width: 100px;height:100px">
       <tr>
         <td  rowspan="3"></td>
        <td></td>
         <td></td>
       </tr>
       <tr>
        
         <td></td>
         <td></td>
       </tr>
       <tr>
         <td></td>
         <td></td>
       </tr>
     </table>