HTML 表格

8.1 表格标签

- <table>:表格容器
- <tr>:表格行
- <th>:表头
- <td>:表格单元
- <caption>:表格标题
- <thead>:语义化-头部,唯一
- <tbody>:语义化-身体部分
- <tfoot>:语义化-脚部,唯一

8.2 table属性

- rowspan:合并行
- colspan:合并列

- align:左右对齐方式。
- left、center、right

- valign:上下对齐方式。
- top、middle、bottom

8.3 练习

<table
  width="500px"
  height="500px"
  align="center"
  border="1px"
  bgcolor="#f6fff0"
  cellspacing="0"
>
  <caption>表格标题</caption>
  <thead>
    <tr>
      <th>row</th>
      <th>val 1</th>
      <th>val 2</th>
    </tr>
  </thead>
  <tbody>
    <tr align="center">
      <td rowspan="2">row:</td>
      <td colspan="2">2</td>
    </tr>
    <tr align="center">
      <td>5</td>
      <td>6</td>
    </tr>
  </tbody>
  <tfoot>
    <tr align="center">
      <td>total:</td>
      <td>7</td>
      <td>8</td>
    </tr>
  </tfoot>
</table>

8.4 效果预览

效果预览

posted @ 2023-05-09 21:07  NZVN  阅读(6)  评论(0编辑  收藏  举报