CSS caption-side 属性

实例

规定表格标题的放置方式：

  1. caption
  2.   {
  3.   caption-side:bottom;
  4.   }

浏览器支持


IE Firefox Chrome Safari Opera
ie firefox chrome safari opera

所有浏览器都支持 caption-side 属性。

注释：如果已规定 !DOCTYPE，那么 Internet Explorer 8 （以及更高版本）支持 caption-side 属性。

定义和用法

caption-side 属性设置表格标题的位置。

说明

该属性指定了表标题相对于表框的放置位置。表标题显示为好像它是表之前（或之后）的一个块级元素。

默认值： top
继承性： yes
版本： CSS2
JavaScript 语法： object.style.captionSide="bottom"

可能的值

值 描述
top 默认值。把表格标题定位在表格之上。
bottom 把表格标题定位在表格之下。
inherit 规定应该从父元素继承 caption-side 属性的值。

实例

设置表格标题的位置

本例演示如何定位表格的标题。 

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  3. <html>
  4. <head>
  5. <style type="text/css">
  6. caption
  7. {
  8. caption-side:bottom
  9. }
  10. </style>
  11. </head>
  12. <body>
  14. <table border="1">
  15. <caption>This is a caption</caption>
  16. <tr>
  17. <td>Adams</td>
  18. <td>John</td>
  19. </tr>
  20. <tr>
  21. <td>Bush</td>
  22. <td>George</td>
  23. </tr>
  24. </table>
  26. <p><b>注释：</b>如果已规定 !DOCTYPE，那么 Internet Explorer 8 （以及更高版本）支持 caption-side 属性。</p>
  28. </body>
  29. </html>

相关页面

CSS 教程：CSS 表格

HTML DOM 参考手册：captionSide 属性