数据分析,一般都需要显示数据,就需要使用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. Ionic入门四:卡片

    近年来卡片(card)的应用越来越流行,卡片提供了一个更好组织信息展示的工具. 针对移动端的应用,卡片会根据屏幕大小自适应大小. 我们可以很灵活的控制卡片的显示效果,甚至实现动画效果. 卡片一般放在页 ...

  2. Web API的几种调用方式

    示例是调用谷歌短网址的API. 1. HttpClient方式: public static async void DoAsyncPost() { DateTime dateBegin = DateT ...

  3. CSUOJ 1271 Brackets Sequence 括号匹配

    Description ]. Output For each test case, print how many places there are, into which you insert a ' ...

  4. gdg shell

    export TIMESTAMP=`date +%Y%m%d_%H%M%S`GDGFILE=file1_${TIMESTAMP}.txtsuffix=${GDGFILE#*_}prefix=${suf ...

  5. js中对同步和异步的理解

    你应该知道,javascript语言是一门“单线程”的语言,不像java语言,类继承Thread再来个thread.start就可以开辟一个线程,所以,javascript就像一条流水线,仅仅是一条流 ...

  6. 装部署VMware vSphere 5.5文档 (6-2) 为IBM x3850 X5服务器安装配置VMware ESXi

    部署VMware vSphere 5.5 实施文档 ########################################################################## ...

  7. 使用IIS实现反向代理

    IIS的反向代理是通过ARR模块来完成的,ARR模块需要另外安装,而且只能通过Web PlatForm Installer安装.关于安装来源与步骤,帖子已有很多,不做描述.启用“Application ...

  8. Hibernate与Mybatis对比

    Hibernate与Mybatis对比 两者相同点 Hibernate与MyBatis都可以是通过SessionFactoryBuider由XML配置文件生成SessionFactory,然后由Ses ...

  9. 转 MySQL连接超时

    在负载较重的MySQL服务器上,有时你偶尔会看到一些连接超时的错误,诸如: Can’t connect to MySQL server on ‘mydb’(110).如果当时你有多个连接请求,你会发现 ...

  10. w​x​F​o​r​m​B​u​i​l​d​e​r​初​体​验

    第一步 打开wxFormBuilder 修改工程信息并保存工程 Name: 工程名 File: 生成代码(.py)文件名 Code_generation: 生成代码类型 第二步 创建窗体 切换至for ...