Html Table 合并单元格

版权声明:作者:jiankunking 欢迎转载,未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接。 https://blog.csdn.net/xunzaosiyecao/article/details/46953073

<!DOCTYPE html>
<html lang="en">
  
  <head>
    <meta charset="UTF-8">
    <title></title>
  </head>
  
  <body>
    <ol>
      <li>基本表格</li>
      <table border="2" bordercolor="black" width="300" cellspacing="0" cellpadding="5">
        <tr>
          <td>1.1</td>
          <td>1.2</td>
          <td>1.3</td></tr>
        <tr>
          <td>2.1</td>
          <td>2.2</td>
          <td>2.3</td></tr>
        <tr>
          <td>3.1</td>
          <td>3.2</td>
          <td>3.3</td></tr>
      </table>
      <br/>
      <li>表格合并列</li>
      <table border="2" bordercolor="black" width="300" cellspacing="0" cellpadding="5">
        <tr>
          <td colspan="3">1.1</td>
          <!--<td>1.2</td>-->
          <!--<td>1.3</td>--></tr>
        <tr>
          <td>2.1</td>
          <td>2.2</td>
          <td>2.3</td></tr>
        <tr>
          <td>3.1</td>
          <td>3.2</td>
          <td>3.3</td></tr>
      </table>
      <br/>
      <li>表格合并行</li>
      <table border="2" bordercolor="black" width="300" cellspacing="0" cellpadding="5">
        <tr>
          <td rowspan="3">1.1</td>
          <td>1.2</td>
          <td>1.3</td></tr>
        <tr>
          <!--<td>2.1</td>-->
          <td>2.2</td>
          <td>2.3</td></tr>
        <tr>
          <!--<td>3.1</td>-->
          <td>3.2</td>
          <td>3.3</td></tr>
      </table>
      <br/>
      <li>复杂表格</li>
      <table border="2" bordercolor="black" width="300" cellspacing="0" cellpadding="5">
        <tr>
          <td>1.1</td>
          <td colspan="2">1.2</td>
          <!--<td>1.3</td>--></tr>
        <tr>
          <td>2.1</td>
          <td rowspan="2">2.2
            <br/>3.2</td>
          <td>2.3</td></tr>
        <tr>
          <td>3.1</td>
          <!--<td>3.2</td>-->
          <td>3.3</td></tr>
      </table>
      <br/></ol>
  </body>

</html>

效果如下:

小注:

  • 4
    点赞
  • 16
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值