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

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

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

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

 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>复杂表格</title>
</head>
<body>
<center>
<table width = "20%" border="1">
<tr>
<th>网站</th>
<th colspan="2">统计情况</th> <!-- colspan="2" 占位,表示这一列占2列 -->
</tr>
<tr>
<td rowspan="3">奇虎360</td> <!-- rowspan="2" 占位,表示这一列占3行 -->
<td>http://hao.360.cn/</td>
<td>11</td>
</tr>
<tr>
<td>http://sh.qihoo.com/</td>
<td>22</td>
</tr>
<tr>
<td>http://video.so.com/</td>
<td>33</td>
</tr>
</table>
</center>
</body>
</html>

显示:

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

html 制作复杂table的更多相关文章

  1. 利用js制作html table分页示例(js实现分页)

    有时候table的列数太长,不利于使用者查询,所以利用JS做了一个table的分页,以下为相关代码 一.JS代码 <script type="text/javascript" ...

  2. 我的第六个网页制作:table标签

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  3. html 表格的制作

    表格的制作 表格<table></table> <table  width=""  height=""  align=" ...

  4. ASP.NET MVC5+EF6+EasyUI 后台管理系统(41)-组织架构

    系列目录 本节开始我们要实现工作流,此工作流可以和之前的所有章节脱离关系,也可以紧密合并. 我们当初设计的项目解决方案就是可伸缩可以拆离,可共享的项目解决方案.所以我们同时要添加App.Flow文件夹 ...

  5. X5的UI部分和传统Web页面开发的差异

    http://doc.wex5.com/different-with-std-web-ui/#1 X5的UI部分和传统Web页面开发的差异 WeX5是跨端移动开发框架,BeX5是基于WeX5的企业快速 ...

  6. CSS書寫規範及CSS Hack

    基本原则: CSS样式可细分为3类:自定义样式.重新定义HTML样式.链接状态样式. 样式为设计师自定义的新 CSS 样式,影响被使用本样式的区域,用于完成网页中局部的样式设定. 样式名 “.”+“相 ...

  7. 构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统(41)-组织架构

    原文:构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统(41)-组织架构 本节开始我们要实现工作流,此工作流可以和之前的所有章节脱离关系,也可以紧密合并. 我们当 ...

  8. 利用USearch去除嵌合体(chimeras)

    嵌合体序列指在pcr过程中,两条不同的序列产生杂交扩增的序列,属于人工污染,在ITS和16S分析中,应该首先去除,USearch提供去除嵌合体的功能 usearch -uchime_ref reads ...

  9. html笔记第一天

    快速生成标签有序ol>li*3无序ul>(li>a{新闻标题})*3定义列表 dl>(dt+dd)*3制作表格table>(tr>td*5)*6pading:3个数 ...

随机推荐

  1. Jersey入门三:创建一个JavaEE的Web项目

    1.在终端中输入如下命令,创建一个名为的simple-service-webapp项目: mvn archetype:generate -DarchetypeArtifactId=jersey-qui ...

  2. centos7 安装 supervisor

    一.安装 supervisor yum install python-setuptools easy_install supervisor 如果easy_install不好使就从官方下载: wget ...

  3. php匹配邮箱正则

    php匹配邮箱正则 '/[a-z0-9&\-_.]+@[\w\-_]+([\w\-.]+)?\.[\w\-]+/is'

  4. iOS 11开发教程(七)编写第一个iOS11代码Hello,World

    iOS 11开发教程(七)编写第一个iOS11代码Hello,World 代码就是用来实现某一特定的功能,而用计算机语言编写的命令序列的集合.现在就来通过代码在文本框中实现显示“Hello,World ...

  5. iOS 9应用开发教程之多行读写文本ios9文本视图

    iOS 9应用开发教程之多行读写文本ios9文本视图 多行读写文本——ios9文本视图 文本视图也是输入控件,与文本框不同的是,文本视图可以让用户输入多行,如图2.23所示.在此图中字符串“说点什么吧 ...

  6. iOS Sprite Kit教程之编写程序以及Xcode的介绍

    iOS Sprite Kit教程之编写程序以及Xcode的介绍 Xcode界面介绍 一个Xcode项目由很多的文件组成,例如代码文件.资源文件等.Xcode会帮助开发者对这些文件进行管理.所以,Xco ...

  7. android 消息机制,handler机制,messageQueue,looper

    韩梦飞沙  韩亚飞  313134555@qq.com  yue31313  han_meng_fei_sha handler  就是 处理器 .  用来处理消息, 发送消息. handler   就 ...

  8. Codeforces.739E.Gosha is hunting(DP 带权二分)

    题目链接 \(Description\) 有\(n\)只精灵,两种精灵球(高级和低级),每种球能捕捉到第\(i\)只精灵的概率已知.求用\(A\)个低级球和\(B\)个高级球能捕捉到精灵数的最大期望. ...

  9. 【漏洞预警】Intel爆CPU设计问题,导致win和Linux内核重设计(附测试poc)

    目前研究人员正抓紧检查 Linux 内核的安全问题,与此同时,微软也预计将在本月补丁日公开介绍 Windows 操作系统的相关变更. 而 Linux 和 Windows 系统的这些更新势必会对 Int ...

  10. C++ 刷题常用函数总结

    平时常用C++刷一些算法题,C++内置了许多好用的工具函数,但时间一长总是容易忘记,这里简单做一下总结,方便复习! <stdlib.h> atoi(const char* str) 将一串 ...