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

摘要

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

语法：<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. JS论坛地址备忘

    论坛: 百度JS吧 CSDN论坛JS版 AS天地会JS区 编程论坛JS版 开源中国JS分享 开源中国JS提问区 德问 JS堂 CSS-JS前端论坛 蓝色理想 ITEYE php100 phpspeak ...

  2. 清除html的标签和行内样式

    function shieldStyle(){ this._styleStartArr=["<span","<p","<strong ...

  3. Android Wear开发 - 数据通讯 - 第三节 : 事件处理

    http://developer.android.com/training/wearables/data-layer/events.html 以下是本人在学习官方开发文档时的笔记,主要是翻译为主,并在 ...

  4. Java中的移位操作符

    记住所有的移动位数,针对的都是补码来讲的,所以要先将十进制整数转换成补码后,然后再来进行移位操作 移位操作 还要注意类型的约束条件,例如int,移动范围是0-31位,所以看补码只能看最后五位,这才是有 ...

  5. BZOJ 1054 [HAOI2008]移动玩具

    1054: [HAOI2008]移动玩具 Time Limit: 10 Sec  Memory Limit: 162 MBSubmit: 1388  Solved: 764[Submit][Statu ...

  6. 图论（网络流）：[HNOI 2013]切糕

    [HNOI 2013]切糕 第三题:切糕(程序文件名:cake.exe)100 分,运行时限:5s 经过千辛万苦小A 得到了一块切糕,切糕的形状是长方体,小A 打算拦腰将切糕切成两半分给小B.出于美观 ...

  7. 服务端调用js：javax.script

    谈起js在服务端的应用,大部分人的第一反应都是node.js.node.js作为一套服务器端的 JavaScript 运行环境,有自己的独到之处,但不是所有的地方都需要使用它. 例如在已有的服务端代码 ...

  8. Android USB安全调试

    Android 4.2.2 引入了USB安全调试方面的内容,当启用安全调试的时候,只有被用户认证过的主机才可以通过Android SDK自带的ADB工具经由USB连接来访问设备的内部构件. 下面以an ...

  9. FZYZOJ-1569 喝水

    P1569 -- 喝水 时间限制:2000MS      内存限制:131072KB 状态:Accepted      标签:    无   无   无 Description GH的N个妹子要喝水, ...

  10. 遇到的retain cycle例子

    retain cycle 会造成内存溢出,严重情况会引起崩溃.一般注意点也不会发生,但在网络连接比较多的地方就会不小心出现,vc异步的网络请求,成功后的block调用vc,如果此时,用户已经不用此vc ...