表格还是需要添加一些标签进行优化，可以添加标题和摘要。代码如下：

摘要

摘要的内容是不会在浏览器中显示出来的。它的作用是增加表格的可读性(语义化)，使搜索引擎更好的读懂表格内容，还可以使屏幕阅读器更好的帮助特殊用户读取表格内容。

语法：<table summary="表格简介文本">

标题

用以描述表格内容，标题的显示位置：表格上方。

语法：

<table>

    <caption>标题文本</caption>

    <tr>

        <td>…</td>

        <td>…</td>

        …

    </tr>

…

</table>

示例:
<!DOCTYPE HTML>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>认识table表标签</title>

<style type="text/css">

table tr td,th{

    border:1px solid #000;

}

</style>

</head>

<body>

<table summary="本表格记录2012年到2013年库存记录，记录包括U盘和耳机库存量">

    <caption>2012年到2013年库存记录</caption>

  <tr>

    <th>产品名称 </th>

    <th>品牌 </th>

    <th>库存量（个） </th>

    <th>入库时间 </th>

  </tr>

  <tr>

    <td>耳机 </td>

    <td>联想 </td>

    <td>500</td>

    <td>2013-1-2</td>

  </tr>

  <tr>

    <td>U盘 </td>

    <td>金士顿 </td>

    <td>120</td>

    <td>2013-8-10</td>

  </tr>

  <tr>

    <td>U盘 </td>

    <td>爱国者 </td>

    <td>133</td>

    <td>2013-3-25</td>

  </tr>

</table>

</body>

</html>

效果:

caption标签，为表格添加标题和摘要的更多相关文章

  1. caption，为表格增加标题和摘要

    格式: <table summary="***"> <caption>***</caption> <tr> </tr> ...

  2. 如何在HTML中添加表格标题？（HTML中table添加标题的2种方法）

    第一种:通过 fieldset 添加标题框 示例代码: <html> <body> <fieldset> <legend>fieldset添加框标题&l ...

  3. js如何实现动态在表格中添加标题和去掉标题？

    js如何实现动态在表格中添加标题和去掉标题? 一.总结 1.通过table标签的createCaption(),deleteCaption()方法实现. document.getElementById ...

  4. 在<s:iterator>标签里给动态表格添加序号

    在<s:iterator>标签里给动态表格添加序号,需要用到<s:iterator>标签里的Status属性里的count eg:<s:iterator value=&q ...

  5. html5常用标签table表格布局

    html5常用标签table表格布局 一.总结 一句话总结: 二.html5常用标签table表格布局 用表格显示信息调理清楚,使浏览者一目了然.表格在网页中还有协助布局的作用,可以把文字.图像等组织 ...

  6. HTML入门(转义字符、行内样式和块级元素、定位、锚点、跑马灯标签、图片标签、表格标签的讲解)

    一.转义字符由特殊字符包裹的文本 会当做标签去解析 对应不换行空格 对应全角空格 em是字体排印学的计量单位,相当于当前指定的点数.其占据的宽度正好是1个中文宽度,而且基本上不受字体影响.<对应 ...

  7. Day46（列表标签，表格标签，表单标签，css的引入方式，css选择器）

    一.列表标签 列表标签分为三种. 1.无序列表<ul>,无序列表中的每一项是<li> 英文单词解释如下: ul:unordered list,“无序列表”的意思. li:lis ...

  8. bootstrap表格添加按钮、模态框实现

    bootstrap表格添加按钮.模态框实现 原创 2017年07月20日 17:35:48 标签: bootstrap 1723 bootstrap表格添加按钮.模态框实现 - 需求: 需要表格后面每 ...

  9. 为HTML表格添加交互功能------DataTables

    DataTables是一个功能强大的Javascript库,用于为HTML表格添加交互功能,虽然简单性是整个项目的核心设计原则,但入门看起来相当艰巨.但是,采取这些第一步并在您的网站上运行DataTa ...

随机推荐

  1. codeforces C. Xor-tree

    http://codeforces.com/problemset/problem/430/C 题意:在一棵上有n个节点,有n-1条边,在每一个节点上有一个值0或1,然后给你一个目标树,让你选择节点,然 ...

  2. 通过PHP连接MYSQL数据库 创建数据库 创建表

    通过PHP连接MYSQL数据库  $conn = mysql_connect("localhost","root","password") ...

  3. PHP实现登录，注册，密码修改

    注册,登录,修改密码 1.登录 2.忘记密码 3.免费注册 页面布局 <div id="views" class="views"> <div ...

  4. Linux&shell 之Shell命令进阶

    写在前面:案例.常用.归类.解释说明.(By Jim) 监控程序a.进程查看ps -ef(-e表示系统上运行的所有进程,-f用于扩展输出一些有用的信息列.)ps -efH(-H参数可以将进程组织为分层 ...

  5. Qt入门（12）——Qt国际化

    应用的国际化就是使应用成为能被非本国的人使用的过程.有的情况下,国际化很简单,例如,使一个US应用可被Australian或者British用户理解,工作可能少于几个拼写修正.但是使一个US应用可以被 ...

  6. 去掉cell边框的简单办法

    实很简单,把backgroundView设置为一个空的View,然后就干净了 UIView *tempView = [[UIView alloc] init]; [cell setBackground ...

  7. （转载）在Linux下删除文件行末尾的^M符号方法

    (转载)http://www.xinfengit.com/200907/1433646.html 由于DOS下的编辑器和linux(linux教程 linux培训 )编辑器对文件行末的回车符处理不一致 ...

  8. 数据结构（树套树）：ZJOI 2013 K大数查询

    有几个点卡常数…… 发现若第一维为位置,第二维为大小,那么修改时第一维修改区间,查询时第一维查询区间,必须挂标记.而这种情况下标记很抽象,而且Push_down不是O(1)的,并不可行. 那要怎么做呢 ...

  9. 数学：UVAoj 11174 Stand in a Line

    Problem J Stand in a Line Input: Standard Input Output: Standard Output All the people in the bytela ...

  10. JavaScript 调试常见报错以及修复方法

    (看到一篇调试JS很有用的文章,收藏一下) JavaScript 调试是一场噩梦:首先给出的错误非常难以理解,其次给出的行号不总有帮助.有个查找错误含义,及修复措施的列表,是不是很有用? 以下是奇怪的 ...