CSS caption-side 属性

CSS caption-side 属性会将表格的标题 <caption> 放到规定的位置。但是具体显示的位置与表格的 writing-mode 属性值有关。

实例

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

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<style type="text/css">
caption
{
caption-side:bottom
}
</style>
</head>
<body>
<table border="1">
<caption>这是一个标题</caption>
<tr>
<td>埃隆</td>
<td>马斯克</td>
</tr>
<tr>
<td>史蒂夫</td>
<td>罗杰斯</td>
</tr>
</table>
<p><b>注释：</b>如果已规定 !DOCTYPE，那么 Internet Explorer 8 （以及更高版本）支持 caption-side 属性。</p>
</body>
</html>

运行一下

浏览器支持

表格中的数字注明了完全支持该属性的首个浏览器版本。

属性
caption-side	1.0	8.0	1.0	1.0	4.0

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

定义和用法

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

说明

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

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

可能的值

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

CSS caption-side 属性

实例

浏览器支持

定义和用法

说明

可能的值

相关页面

分类导航