zoukankan      html  css  js  c++  java
  • caption标签,为表格添加标题和摘要

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

    摘要

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

        语法:<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>

     效果:

  • 相关阅读:
    where T: class的解释
    调用钉钉的WebAPI接口实现与ERP数据的同步
    Json序列化和反序列化的方式
    Log4Net日志处理
    MVC项目中异常处理
    FindBI商业智能报表工具
    权限列表实现
    委托,匿名,lambda
    [经典贪心算法]贪心算法概述
    [zt]手把手教你写对拍程序(PASCAL)
  • 原文地址:https://www.cnblogs.com/Rinpe/p/5539321.html
Copyright © 2011-2022 走看看