在一个实例中碰到表格,总结下,先上代码,例:

<table border="1">
<thead>
<th>表头</th>
<th>表头</th>
<th>表头</th>
</thead>
<tbody>
<tr>
<td>表内容单元格</td>
<td>表内容单元格</td>
<td><a href="#">操作</a></td>
</tr>
<tr>
<td>表内容单元格</td>
<td>表内容单元格</td>
<td><a href="#">操作</a></td>
</tr>
<tr>
<td>表内容单元格</td>
<td>表内容单元格</td>
<td><a href="#">操作</a></td>
</tr>
<tr>
<td>表内容单元格</td>
<td>表内容单元格</td>
<td><a href="#">操作</a></td>
</tr>
</tbody>
<tfoot>
<tr>
<td>总计</td>
<td colspan="2">1000</td>
</tr>
</tfoot>
</table>

  显示效果如下:

  总结:

  • <thead>标签:用于定义表格的表头,该标签用于组合 HTML 表格的表头内容;<thead> 内部必须拥有 <tr> 标签!

   <th> 元素内部的文本通常会呈现为居中的粗体文本,而 td 元素内的文本通常是左对齐的普通文本。

  • <tbody>标签:用于对 HTML 表格中的主体内容进行分组;
  • <tfoot>标签:用于对 HTML 表格中的表注(页脚)内容进行分组;

如果使用 thead、tfoot 以及 tbody 元素,就必须使用全部的元素。它们的出现次序是:thead、tfoot、tbody,这样浏览器就可以在收到所有数据前呈现页脚了,并且必须在 table 元素内部使用这些标签。

HTML5学习笔记(四):关于表格的更多相关文章

  1. HTML5学习笔记<四>: 列表, 块和布局

    HTML列表 列表标签 标签 描述 <ol> 定义有序列表. <ul> 定义无序列表. <li> 定义列表项. <dl> 定义定义列表. <dt& ...

  2. HTML5学习笔记四 HTML文本格式化

    HTML 格式化标签 HTML 使用标签<b> 与<i> 对输出的文本进行格式, 如:粗体 or 斜体 这些HTML标签被称为格式化标签 通常标签 <strong> ...

  3. HTML5学习笔记四:html5结构

    一.大纲:大纲即文档中各内容区块的结构编排 1. 显示编排内容区块:使用section等元素创建文档结构,每个内容区块使用标题(h1~h6,hgroup); 2. 隐式编排内容区块:根据页面所书写的各 ...

  4. HTML5学习笔记之表格标签

    HTML5学习笔记之表格标签 其他HTML5相关文章 HTML5学习笔记之HTML5基本介绍 HTML5学习笔记之基础标签 HTML5学习笔记之表格标签 HTML5学习笔记之表单标签 HTML5学习笔 ...

  5. html5学习笔记一

    HTML5学习笔记 <video>标记:定义视频,Ogg.MPEG4.WebM三种格式 <video src=”movie.ogg”  controls=”controls”> ...

  6. C#可扩展编程之MEF学习笔记(四):见证奇迹的时刻

    前面三篇讲了MEF的基础和基本到导入导出方法,下面就是见证MEF真正魅力所在的时刻.如果没有看过前面的文章,请到我的博客首页查看. 前面我们都是在一个项目中写了一个类来测试的,但实际开发中,我们往往要 ...

  7. IOS学习笔记(四)之UITextField和UITextView控件学习

    IOS学习笔记(四)之UITextField和UITextView控件学习(博客地址:http://blog.csdn.net/developer_jiangqq) Author:hmjiangqq ...

  8. java之jvm学习笔记四(安全管理器)

    java之jvm学习笔记四(安全管理器) 前面已经简述了java的安全模型的两个组成部分(类装载器,class文件校验器),接下来学习的是java安全模型的另外一个重要组成部分安全管理器. 安全管理器 ...

  9. Learning ROS for Robotics Programming Second Edition学习笔记(四) indigo devices

    中文译著已经出版,详情请参考:http://blog.csdn.net/ZhangRelay/article/category/6506865 Learning ROS for Robotics Pr ...

  10. Typescript 学习笔记四:回忆ES5 中的类

    中文网:https://www.tslang.cn/ 官网:http://www.typescriptlang.org/ 目录: Typescript 学习笔记一:介绍.安装.编译 Typescrip ...

随机推荐

  1. 给WordPress的TinyMCE Advanced编辑器加上中文字体

    为TinyMCE编辑器增加中文字体并不复杂,只需要将将如下代码加到当前主题的functions.php文件中最后一个?>的前面即可: 不要忘记保存,然后更新一遍浏览器即可 //为TinyMCE编 ...

  2. javascript中作用域

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. ubuntu+win10双系统,调整分区大小后进入了emergency mode

    问题背景: 装了Ubuntu+win10双系统,在Ubuntu下面挂载了Windows的D盘.后来因为D空间不够,进入Windows压缩C盘分区,扩大了D盘.重启后无法启动Ubuntu,进入了emer ...

  4. Hibernate中解决No Hibernate Session bound to thread问题

    引用:忘了 首先是getCurrentSession()与openSession()的区别: 1.getCurrentSession()与openSession()的区别? * 采用getCurren ...

  5. linux下使用Android studio启动模拟器时提示 waiting for target device to come online 的问题

    方法来自:http://stackoverflow.com/questions/42612468/how-can-i-get-more-information-about-waiting-for-ta ...

  6. win 7环境下java环境变量的配置

    http://www.cnblogs.com/zhj5chengfeng/archive/2013/01/01/2841253.html %Java_Home%\bin;%Java_Home%\jre ...

  7. HashMap以及ConcurrentHashMap

    HashMap源码相关 HashMap实现原理及源码分析 总之就是这个博客,简直就是源码带逛,开心,最关键的是下面的图像 另外,自己的理解加上源码,总结如下 hash,原义散列,就是一对一: hash ...

  8. 编写jQuery 插件

    编写jQuery Plugin,要设置默认值,并允许用户修改默认值,或者运行是传入其他值. 最终,我们得出编写一个jQuery插件的原则: 给$.fn绑定函数,实现插件的代码逻辑: 插件函数最后要 r ...

  9. 搜索关键词和类目url简短化

    电商网站中有很多搜索关键词或者类目的url往往是一大串的url:有个需求是将长的url如: 域名+/products.html?q=大侠&showtype=img&sort=isTra ...

  10. 路飞学城Python-Day117

    jango用户登录界面 """ Django settings for cnblog project. Generated by 'django-admin startp ...