博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
table合并单元格colspan和rowspan
阅读量:5899 次
发布时间:2019-06-19

本文共 1139 字,大约阅读时间需要 3 分钟。

colspanrowspan这两个属性用于创建特殊的表格。

colspan是“column span(跨列)”的缩写。colspan属性用在td标签中,用来指定单元格横向跨越的列数

在浏览器中将显示如下:

单元格1
单元格2 单元格3 单元格4

该例通过把colspan设为“3”, 令所在单元格横跨了三列。如果我们将colspan设为“2”,则该单元格将只跨越两列,于是有必要在第一行插入另外一个单元格,以确保两行占据相同的列数。

该例在浏览器中将显示如下:

单元格1 单元格2
单元格3 单元格4 单元格5

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

浏览器中将显示如下:

单元格1 单元格2
单元格3
单元格4

上例中的单元格1,其rowspan被设为“3”,这表示该单元格必须跨越三行(本身一行,加上另外两行)。因此,单元格1和单元格2在同一行,而单元格3和单元格4形成独立的两行。

 

 

综合实例

ss
       
       
     
   
     

<html>

<head>

</head>

<table border= "1 " width= "200 " >

  <tr>
    <td colspan="4" >ss

    </td>

  </tr>
  <tr>
    <td width= "25% ">   </td> 
    <td width= "25% ">   </td> 
    <td width= "25% ">   </td> 
    <td width= "25% ">   </td> 
  </tr>
  <tr>
    <td width= "25% "rowspan="2">   </td>
    <td width= "25% ">   </td> 
    <td width= "25% ">   </td> 
    <td width= "25% ">   </td> 
  </tr>
  <tr>

    <td width= "25% ">   </td>

    <td width= "25% " rowspan="3">   </td>
    <td width= "25% ">   </td> 
  </tr>
  <tr>
    <td width= "25% " colspan="2" >   </td>
    <td width= "25% ">   </td>

  </tr>

  <tr>
    <td width= "25% ">   </td> 
    <td width= "25% ">   </td> 
    <td width= "25% ">   </td>

  </tr>

</table>

</html>

 

转载地址:http://yqesx.baihongyu.com/

你可能感兴趣的文章
糗事百科正则爬虫
查看>>
ajax请求
查看>>
机器学习总论:判别式模型和生成式模型
查看>>
SharePoint2013 Set Value To PeoplePicker
查看>>
四种常见线程池
查看>>
jQuery的动画处理总结 BY:色拉油啊油
查看>>
ASP.NET MVC Razor视图引擎基础语法
查看>>
MapInfo 文件格式说明
查看>>
JAVA 之 继承
查看>>
51Nod 1090 3个数和为0(暴力)
查看>>
cocos2d视图zoom缩放
查看>>
iPhone 制作lib
查看>>
iOS后台播放背景音乐文件(转载)
查看>>
ios专题 - openSSL
查看>>
数据库备份与恢复
查看>>
黄聪:入侵必读:网警如何找到你
查看>>
Python 正则表达式应用【转载】
查看>>
fuz 2159 WuYou
查看>>
Nginx页面图片错误 ERR_CONTENT_LENGTH_MISMATCH
查看>>
SQL Server-表表达式基础回顾(二十四)
查看>>