9 . HTML表格 -- table 标签 -- 把数据放在表格中

9.1. HTML表格视频教程
9.2. HTML tr 标签
9.3. HTML th 标签
9.4. HTML td 标签
9.5. HTML cellpadding与cellspacing属性
9.5.1 HTML表格的填充与间距视频教程
9.6. HTML rowspan 属性
9.7. HTML colspan 属性
9.7.1 HTML表格的rowspan与colspan视频教程
9.8. 自定义列样式
9.8.1 HTML colgroup 标签
9.8.2 HTML col 标签
9.9. 表格躯干
9.9.1 HTML thead 标签
9.9.2 HTML tbody 标签
9.9.3 HTML tfoot 标签

表格table曾经是页面排版最有用的工具,但是表格排版带来的弊端也显露无疑.

猴子提示: 表格最重要的目的是显示"表格状的数据"

table 标签 -- 代表HTML表格
  • table标签是成对出现的,以<table>开始,以</table>结束
  • 引用网址:http://www.dreamdu.com/xhtml/tag_table/
  • 属性
    • Common -- 一般属性
    • summary -- 代表表格的摘要说明
    • width -- 代表表格的宽度
    • border -- 代表表格边框(此属性应该使用CSS实现)
    • cellspacing -- 代表表格边框与表格内容填充的距离,也是内容填充之间的距离(此属性应该使用CSS实现)
    • cellpadding -- 代表内容填充的宽度(此属性应该使用CSS实现)
  • table，中文"表格"的意思

示例

<table width="80%" border="1">
        <tr>
                <th>www.dreamdu.com</th>
                <th>.com域名的数量</th>
                <th>.cn域名的数量</th>
                <th>.net域名的数量</th>
        </tr>
        <tr>
                <td>2003年</td>
                <td>1000</td>
                <td>2000</td>
                <td>3000</td>
        </tr>
        <tr>
                <td>2004年</td>
                <td>4000</td>
                <td>5000</td>
                <td>6000</td>
        </tr>
        <tr>
                <td>2005年</td>
                <td>7000</td>
                <td>8000</td>
                <td>9000</td>
        </tr>
</table>

HTML表格示例 -- 可以尝试编辑

说明

  • width -- 是表格的宽度,可以使用象素px或者百分比
  • border -- 是表格的边框的宽度,使用px表示,此属性应该使用CSS实现
  • tr -- 代表一行
  • th -- 代表表格头
  • td -- 代表一个单元格

延伸阅读

From "HTML表格 - table 标签 -- 把数据放在表格中 - HTML教程,XHTML教程"


  • 教程中有什么不懂的地方？发现教程的错误！对教程有什么建议！快快给我留言呀 给猴子留言，我会尽快解答你的问题:)
  • HTML代码