<!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>

效果如下：

小注：

Html table 合并单元格的更多相关文章

  1. css table 合并单元格

    1. css table 合并单元格 colspan:合并列, rowspan:合并行, 合并行的时候,比如rowspan="2",它的下一行tr会少一列: 合并列的时候,比如co ...

  2. table中tr间距的设定table合并单元格 colspan（跨列）和rowspan（跨行）

    table中的tr的默认display:table-row,虽然可以修改为display:block但是就失去了tr特有的显示效果,如(td自动对齐): 并且在tr中对起设定padding是有用的,可 ...

  3. table合并单元格

    table合并单元格 新建一张表格.要求表格有四行四列,当中第一行的四列合并,第二行.第三行和第四行的第一列合并 <!DOCTYPE html PUBLIC "-//W3C//DTD ...

  4. ant design Table合并单元格合并单元格怎么用？

    1.ant design table合并单元格怎么用?

  5. BootStrap Table 合并单元格

    为了更直观展示表格的一大堆乱七八糟的数据,合并单元格就派上用场: 效果: 贴上JSON数据(后台查询数据一定要对合并字段排序): [ { "city": "广州市&quo ...

  6. 一种HTML table合并单元格的思路

    /** * 合并单元格 * @param table1 表格的ID * @param startRow 起始行 * @param col 合并的列号,对第几列进行合并(从0开始).如果传下来为0就是从 ...

  7. table合并单元格colspan和rowspan .

    colspan和rowspan这两个属性用于创建特殊的表格. colspan是“column span(跨列)”的缩写.colspan属性用在td标签中,用来指定单元格横向跨越的列数: 在浏览器中将显 ...

  8. JQuery Table 合并单元格-解决Bug版本

    网络中提供的方法是: <script type="text/javascript"> function _w_table_rowspan(_w_table_id, _w ...

  9. table合并单元格 colspan（跨列）和rowspan（跨行）

    colspan和rowspan这两个属性用于创建特殊的表格. colspan是“column span(跨列)”的缩写.colspan属性用在td标签中,用来指定单元格横向跨越的列数: 在浏览器中将显 ...

随机推荐

  1. 小K的H5之旅-实战篇（一）

    一.前言 本K在经过两个星期的html和css学习之后,第一次去尝试完成一个网站主页的制作.在四天之后,本K也终于完成了杰瑞教育主页的html和css部分,至于部分涉及js的部分,因为本K还没有学习过 ...

  2. 2-SAT算法

    参考blog 参考论文 参考论文 题目 & 题解 裸2-SAT poj3683 poj3207 poj3678 poj3648 2-SAT + 二分法 poj2723 poj2749 hdu3 ...

  3. CSS3学习系列之选择器（二）

    first-child选择器和last-child选择器 first-child指定第一个元素.last-child指定最后一个子元素. 例如: <!DOCTYPE html> <h ...

  4. php面向对象3

    类的定义 基本定义 class 类名{ 访问修饰符 成员属性; 访问修饰符 成员方法; } 说明: ①类一定要class关键词修饰 ②类名的规范说明,使用大驼峰法 ③php 中,类名不区分大小写.但是 ...

  5. Chapter 3:Speech Production and Perception

    作者:桂. 时间:2017-05-24  09:09:36 主要是<Speech enhancement: theory and practice>的读书笔记,全部内容可以点击这里. 一. ...

  6. [codeforces631E]Product Sum

    E. Product Sum time limit per test: 1 second memory limit per test: 256 megabytes input:standard inp ...

  7. Discuz更改默认搜索模块

    由于网站使用DZ的侧重点不同,在搜索中可能需要更改默认搜索模块 首先找到模板中搜索模块对应的文件,默认模板中搜索模块的地址是 template\default\common\pubsearchform ...

  8. 设置Ubuntu下adb 及 fastboot权限

    以普通用户登录linux,然后运行adb devices会提示权限不够: List of devices attached  ????????????    no permissions   这是因为 ...

  9. 耍一把codegen，这样算懂编译么？

    最近使用protobuf搭了些服务器,对protobuf的机制略感兴趣,所以研究了下. 大致分析没有什么复杂的 1 对定义的结构体生成消息封包协议 2 对定义的rpc函数生成接口定义 3 用户按pro ...

  10. [leetcode-495-Teemo Attacking]

    In LLP world, there is a hero called Teemo and his attacking can make his enemy Ashe be in poisoned ...