html 制作复杂table

数据分析，一般都需要显示数据，就需要使用html做复杂的表格。复杂表格一般是对td的rowspan 、colspan属性值。

在html中<td> 标签定义 HTML 表格中的标准单元格。

　　(1)rowspan 属性规定单元格可横跨的行数;

　　(2)colspan 属性规定单元格可横跨的列数。

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
 2 <html>
 3 <head>
 4     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
 5     <title>复杂表格</title>
 6 </head>
 7 <body>
 8     <center>
 9         <table width = "20%" border="1">
10             <tr>
11                 <th>网站</th>
12                 <th colspan="2">统计情况</th>    <!-- colspan="2"  占位,表示这一列占2列 -->
13             </tr>
14             <tr>
15                 <td rowspan="3">奇虎360</td>    <!-- rowspan="2"  占位,表示这一列占3行 -->
16                 <td>http://hao.360.cn/</td>
17                 <td>11</td>
18             </tr>
19             <tr>
20                 <td>http://sh.qihoo.com/</td>
21                 <td>22</td>
22             </tr>
23             <tr>
24                 <td>http://video.so.com/</td>
25                 <td>33</td>
26             </tr>
27         </table>
28     </center>
29 </body>
30 </html>

显示：

rowspan 、colspan 可以理解为占位。占行数、列数。

转载于:https://www.cnblogs.com/xudong-bupt/p/3950586.html

html 制作复杂table相关推荐

利用js制作html table分页示例(js实现分页)
有时候table的列数太长,不利于使用者查询,所以利用JS做了一个table的分页,以下为相关代码一.JS代码 <script type="text/javascript" ...
刀剑神域动漫网页设计作品学生表格布局网页作业成品 table漫画网站制作 dreamweaver静态HTML学生网页制作模板
刀剑神域动漫网页设计知识点介绍网页制作说明网页代码演示导航代码正文代码网页效果预览成品地址知识点介绍使用dreamweaver制作采用table表格布局.网页背景颜色.底部版权区域 ...
完成HTML网页制作之后的成果,index.html
BaoChengGuo let antiquityStorage = window.sessionStorage.getItem('antiquitySessionStorage'); if (ant ...
Day02 HTML制作表格以及练习
HTML 制作表格 table标签:表格标签 tr标签:表格中的行 th标签:表格的表头默认居中 td标签:表格单元格默认左并齐 cellpadding="数字"填充外边框 c ...
table基础学习-行列布局和滚动条隐藏
可视化类型页面制作心得----table table 表格类型的数据要写可视化很少会少得了表格的参与,第一次写云子可视化的时候就直接用div堆了一个表格出来,效果不尽人意 - 一．表格元素总汇 ...
制作html邮件的注意要点
PS:第一次制作html的邮件代码时候以及使用的div+css的布局方式其完成后,发现将其的上传的浏览效果很不理想,里面的一些标签的效果失效,js失效,css的浮动定位等都失效,效果造成页面混乱,查了 ...
table表格基础知识及简单运用
1.什么是table表格在HTML中我们用< table >标签来定义表格,它和Excel表格类似,都包括行.列.单元格.表头等,但是在功能方面HTML的表格远不如Excel强大. 2. ...
摄像头PVD和CVD薄膜
摄像头PVD和CVD薄膜在FDP 的生产中,在制作无机薄膜时,可以采用的方法有两种:PVD 和CVD (将VE 和VS 归于PVD ,而ALD 归于CVD). Physical Vapor Depo ...
认识 PHP 的hash函数
Hashing function (散列函式) 在网页应用中被广泛采用,从数码签署.错误检测.登入验证.到压缩储存空间,由于它的原理比较复杂,很多人把它跟加密函式混淆,对于如何运用hash funct ...

html 制作复杂table

html 制作复杂table相关推荐

最新文章

热门文章