CSS 属性

caption-side 属性指定表格标题的显示位置（顶部或底部）。

属性值

  • top: 将标题的元素框放置在表格框上方。

  • bottom: 将标题的元素框放置在表格框下方。

适用范围

所有 HTML 定位元素。

DOM 语法

object.style.captionSide = "top";

示例

这里是显示用法的示例此属性 -

<html>
<head>
<style>
   caption.top {caption-side: top}
   caption.bottom {caption-side: bottom}
</style>
</head>
<body>
   <div>
      <h2>caption-side: top</h2>
      <table style = "width: 400px; border: 2px solid black;">
         <caption class = "top">
            该标题将出现在表格的顶部。
         </caption>
         <tr><td >Data 1</td></tr>
         <tr><td >Data 2</td></tr>
      </table>
   </div>
   <div>
   <h2>caption-side: bottom</h2>
      <table style = "width: 400px; border: 2px solid black;">
         <caption class = "bottom">
            该标题将出现在表格的底部。
         </caption>
         <tr><td >Data 1</td></tr>
         <tr><td >Data 2</td></tr>
      </table>
   </div>
</body>
</html>