表格基本格式:
<table>
<tr>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
</tr>
</table>
合并单元格
左右单元格合并需要使用<td>标记的colspan属性完成
上下单元格合并需要使用<td>标记的rowspan属性完成
以下是一个实例:
<table>
<tr>
<td rowspan="2">内容</td>
<td colspan="3">百度使用</td>
</tr>
<tr>
<td>指南针</td>
<td>生活</td>
<td>自然</td>
</tr>
</table>
网页显示结果如下:

为了让表格结构更清晰,以及配合CSS样式,表格中还会体现出表头、主体、脚注等,三者相应的HTML标记依次为<thead>、<tbody>、<tfoot>
另外,在表格中还有两个标记,<caption>表示表格的标题,<th>可以定义表格内的表头单元格
<table>
<caption>学生成绩单</caption>
<thead>
<tr>
<th>姓名</th>
<th>性别</th>
<th>成绩</th>
</tr>
</thead>
<tfoot>
<tr>
<td>平均分</td>
<td colspan="2">540</td>
</tr>
</tfoot>
<tbody>
<tr>
<td>张三</td>
<td>男</td>
<td>560</td>
</tr>
<tr>
<td>李四</td>
<td>男</td>
<td>520</td>
</tr>
</tbody>
</table>
border-collapse: collapse;    合并表格线

Study 3 —— 表格的更多相关文章

  1. 【240】◀▶IEW-Unit05

    Unit 5 Education: Study Abroad 表格技巧讲解 1. Model1对应表格分析 This table shows the numbers of international ...

  2. jsp+oracle实现数据库内容以表格形式在前台显示(包含分页)

    jsp+oracle实现数据库内容以表格形式在前台显示(包含分页) 在文件夹内新增list_emp.jsp 代码如下: <%@ page contentType="text/html& ...

  3. ligerui_实际项目_003:form中添加数据,表格(grid)里面显示,最后将表格(grid)里的数据提交到servlet

    实现效果: "Form"中填写数据,向本页"Grid"中添加数据,转换成Json数据提交,计算总和,Grid文本框可编辑,排序 图片效果: 总结: //disp ...

  4. Data Visualization – Banking Case Study Example (Part 1-6)

    python信用评分卡(附代码,博主录制) https://study.163.com/course/introduction.htm?courseId=1005214003&utm_camp ...

  5. VLOOKUP函数将一个excel表格的数据匹配到另一个表中

    sklearn实战-乳腺癌细胞数据挖掘(博主亲自录制视频) https://study.163.com/course/introduction.htm?courseId=1005269003& ...

  6. pandas连接多个表格concat()函数

    网易云课堂该课程链接地址 https://study.163.com/course/courseMain.htm?share=2&shareId=400000000398149&cou ...

  7. Study Blazor .NET(四)数据绑定

    翻译自:Study Blazor .NET,转载请注明. 数据绑定 单向绑定 在blazor中单向绑定简单而直接,无需UI刷新或渲染.下面示例展示了单向数据绑定: //Counter.razor @p ...

  8. ASP.NET Aries 入门开发教程6:列表数据表格的格式化处理及行内编辑

    前言: 为了赶进度,周末也写文了! 前几篇讲完查询框和工具栏,这节讲表格数据相关的操作. 先看一下列表: 接下来我们有很多事情可以做. 1:格式化 - 键值的翻译 对于“启用”列,已经配置了格式化 # ...

  9. 03.LoT.UI 前后台通用框架分解系列之——多样的表格

    LOT.UI分解系列汇总:http://www.cnblogs.com/dunitian/p/4822808.html#lotui LoT.UI开源地址如下:https://github.com/du ...

随机推荐

  1. PAT L2-011 玩转二叉树

    https://pintia.cn/problem-sets/994805046380707840/problems/994805065406070784 给定一棵二叉树的中序遍历和前序遍历,请你先将 ...

  2. Appium学习笔记4_元素定位方法

    Appium之元素定位,如果对Android上如何使用工具获取页面元素有问题的,请转战到这:http://www.cnblogs.com/taoSir/p/4816382.html. 下面主要是针对自 ...

  3. ionic2/3注册安卓返回

    如果使用了 this.app.getRootNav().push()以及this.navCtrl.push();   则在注册安卓返回键的时候   registerBackButtonAction() ...

  4. NodeJS中的require和import

    ES6标准发布后,module成为标准,标准的使用是以export指令导出接口,以import引入模块,但是在我们一贯的node模块中,我们采用的是CommonJS规范,使用require引入模块,使 ...

  5. python之文件目录操作

    代码示例: # 改变当前目录操作 import os cur = os.curdir print("1.当前目录相对路径:", cur) par = os.pardir print ...

  6. mysql关于binlog日志的操作

    查看binlog日志选项和存储位置: mysql> show variables like 'log_%'; 1.查看所有binlog日志列表 mysql> show master log ...

  7. BZOJ4127Abs——树链剖分+线段树

    题目描述 给定一棵树,设计数据结构支持以下操作 1 u v d 表示将路径 (u,v) 加d 2 u v 表示询问路径 (u,v) 上点权绝对值的和 输入 第一行两个整数n和m,表示结点个数和操作数 ...

  8. 第八届蓝桥杯国赛java B组第三题

    标题:树形显示 对于分类结构可以用树形来形象地表示.比如:文件系统就是典型的例子. 树中的结点具有父子关系.我们在显示的时候,把子项向右缩进(用空格,不是tab),并添加必要的连接线,以使其层次关系更 ...

  9. day13 生成器 三元运算 列表解析

    本质上来说生成器迭代器都是一种数据类型,如果你直接打印生成器是无法得出值的,会得到一串内存地址,即一个对象想要得到生成器的值必须要用for或者next,list等来获取 生成器生成器就是一个可迭代对象 ...

  10. mysql 免安装版 启动服务马上关闭

    在my.ini 加入这一句 1.直接在后面加上一下的参数 [mysqld] port=3306 basedir=D:\mysql-5.7.17-win32 datadir=D:\mysql-5.7.1 ...