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

摘要

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

语法：<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. javascript content

    1. Chrome, Mozila, IE 2. jQuery, underscore, zepto 3. underscore 4. Backbone, AngularJS 5. RequireJS ...

  2. X-Plosives

    uvaLive 3644:https://icpcarchive.ecs.baylor.edu/index.php?option=com_onlinejudge&Itemid=8&pa ...

  3. 开始LXC,DOCKER,VAGRANT,COREOS之旅

    很有兴趣哟. 有人说会重构互联基质,可能言重. 但,无疑在未来几年内,DOCKER和COREOS这样的更新布置模式会流行.

  4. bzoj2502

    学到很多知识的一道题目一开始读错题,后来发现是每条边必须至少访问一次明显是一个有下界的最小流首先是我自己脑补的比较渣的算法,可以无视:对于有下界的最小流,我不会做,但是我会做有下界的费用流,而且注意这 ...

  5. weblogic重置密码

    1.备份DefaultAuthenticatorInit.ldift文件 cd /app/weblogic_cs/Oracle/Middleware/user_projects/domains/ntf ...

  6. Java---计算机贷款支付额计算(用对话框实现)

    本例演示如何编写程序来计算贷款支付问题. 下面是编写程序的步骤: 1.提示用户输入年利率.年数和贷款总额 2.利用年利率算出月利率 3.通过前面的公式计算月支付额. 4.计算总支付额,它是月支付额乘以 ...

  7. 进了ACM之后，我才清楚了自己的方向！！！

    2015年8月29日,从郴州比完赛后,状况并没有想象中的乐观,我被卡在了一个数学题上,本来以为这个题目真的是很容易,天真的以为打表就可以敲的出来,可是并没有,横在了一个结束条件上面,比完赛后真想抽自己 ...

  8. Mac下Intellij IDea发布Java Web项目详解三 新建Module

    准备工作1:新建第一个JavaWeb项目 Step4 添加两个module 4.1 右键[WebWorkSpace]-[New]-[Module] 4.2 重复 准备工作1:新建第一个JavaWeb项 ...

  9. Web 测试笔记

    测试难点 主要是模块之间的同步问题. 测试容易忽略的地方 1. 各种标题.包括页面“标签页”的标题,弹出框的标题.由于开发经常直接用之前的页面,比如编辑可能直接用新增的页面,导致标题出错. 2. 最大 ...

  10. JVM垃圾回收机制入门

    前言 数据库是大家会普遍重视的一个领域,异步通信一般用不到,虚拟机在大部分时候不会出问题,常被人忽视,所以我打算先学习虚拟机,从零单排Java高性能问题. 堆内存存储结构 Java6是以年代来规划内存 ...