首页 > 代码库 > Html表格<table>还是需要添加一些标签进行优化，可以添加标题<caption>和摘要<table summary>

Html表格<table>还是需要添加一些标签进行优化，可以添加标题<caption>和摘要<table summary>

2024-08-01 02:05:44   220人阅读

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>认识table表标签</title><span style="color:#FF0000;"><strong><style type="text/css">
table tr td,th{    border:1px solid #090;//为表格添加边框：像素是1px 实体solid 颜色#000
}
</style></strong></span></head>
<body><strong><span style="color:#FF0000;">//摘要</span><em>summary</em><span style="color:#FF0000;">的内容是不会在浏览器中显示出来的。它的作用是增加表格的可读性(语义化)，//使搜索引擎更好的读懂表格内容，还可以使屏幕阅读器更好的帮助特殊用户读取表格内容。</span></strong> <table summary="本表格记录2013年到2014年库存记录，记录包括U盘和耳机库存量">
  <caption>2013到2014年库存记录</caption<strong><span style="color:#CC0000;">>//用以描述表格内容，标题的显示位置：表格上方。</span></strong>
  <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>


Html表格<table>还是需要添加一些标签进行优化，可以添加标题<caption>和摘要<table summary>


联系
我们