阿西河

所有教程

公众号
🌙
阿西河前端的公众号

我的收藏

    最近访问  (文章)

      教程列表

      抓包专区
      测试专区

      HTML table 标签

      HTML <table> 标签功能

      绘制表格使用;如果是做后台管理的用户列表等类似 Excel 功能,这个标签是最佳的选择

      • <table> 标签定义 HTML 表格

      • 一个 HTML 表格包括 <table> 元素,一个或多个 <tr><th> 以及 <td> 元素。

      • <tr> 元素定义表格行

      • <th> 元素定义表头

      • <td> 元素定义表格单元

      更复杂的 HTML 表格也可能包括

      • <caption>
      • <col>
      • <colgroup>
      • <thead>
      • <tfoot>
      • <tbody>

      HTML <table> 标签用法

      一个简单的 HTML 表格,包含两列两行:

      <table border="1">
          <tr>
              <th>网站名</th>
              <th>网址</th>
          </tr>
          <tr>
              <td>阿西河前端教程</td>
              <td>www.axihe.com</td>
          </tr>
      </table>
      

      HTML <table> 标签演示

      网站名网址
      阿西河前端教程www.axihe.com
      * * *

      浏览器支持

      所有主流浏览器都支持 <table> 标签。


      注意事项

      虽然现在 DIV+CSS 布局非常流行,是取代 table 布局的好选择;

      但是遇到 table 相关的东西,还是使用table标签更佳,请根据实际场景进行选择


      HTML4 与 HTML5 之间的差异

      在 HTML5 中,仅支持 “border” 属性,并且只允许使用值 “1” 或 “"。


      属性

      属性描述
      alignleft
      center
      right
      HTML5 不支持。HTML4 已废弃。 规定表格相对周围元素的对齐方式。
      bgcolorrgb(x,x,x)
      #xxxxxx
      colorname
      HTML5 不支持。HTML4 已废弃。 规定表格的背景颜色。
      border1
      ”"
      规定表格单元是否拥有边框。
      cellpaddingpixelsHTML5 不支持。规定单元边沿与其内容之间的空白。
      cellspacingpixelsHTML5 不支持。规定单元格之间的空白。
      framevoid
      above
      below
      hsides
      lhs
      rhs
      vsides
      box
      border
      HTML5 不支持。规定外侧边框的哪个部分是可见的。
      rulesnone
      groups
      rows
      cols
      all
      HTML5 不支持。规定内侧边框的哪个部分是可见的。
      summarytextHTML5 不支持。规定表格的摘要。
      widthpixels
      %
      HTML5 不支持。规定表格的宽度。

      全局属性

      <table> 标签支持 HTML 全局属性


      事件属性

      <table> 标签支持 HTML 事件属性


      目录
      目录