HTML | DOM 样式 captionSide 属性

介绍

captionSide 属性用于指定表格标题（ caption 元素）的位置。可以设置的值有：

• top：标题位于表格之上（默认值）
• bottom：标题位于表格之下

语法

<table style="caption-side: value;">
  <caption>Table Caption</caption>
  <tr>
    <th>Header 1</th>
    <th>Header 2</th>
  </tr>
  <tr>
    <td>Row 1, Cell 1</td>
    <td>Row 1, Cell 2</td>
  </tr>
  <tr>
    <td>Row 2, Cell 1</td>
    <td>Row 2, Cell 2</td>
  </tr>
</table> 

属性值

• top：标题位于表格之上
• bottom：标题位于表格之下

实例

<table style="caption-side: bottom;">
  <caption>Table Caption</caption>
  <tr>
    <td>Row 1, Cell 1</td>
    <td>Row 1, Cell 2</td>
  </tr>
  <tr>
    <td>Row 2, Cell 1</td>
    <td>Row 2, Cell 2</td>
  </tr>
</table>

将 caption-side 属性设置为 bottom，即可将标题放置在表格底部。

注意事项

captionSide 属性只适用于表格元素（ table ）。同时，在 HTML 5 中，建议使用 CSS 样式表来控制表格样式。