目录

CSS column-rule-width 属性

❮上一节完整的CSS参考下一节❯

示例

指定列之间的规则的宽度：

div {
column-rule-width: 10px;
}

亲自试一试 »

下面有更多 "亲自试一试" 示例。

定义和用法

这个column-rule-width属性指定列之间的规则的宽度。

展示演示❯

默认值：	中等的
遗传：	不
可动画：	是的。阅读可动画的尝试一下
版本：	CSS3
JavaScript 语法：	对象.style.columnRuleWidth="10px"尝试一下

浏览器支持

表中的数字指定完全支持该属性的第一个浏览器版本。

后跟 -webkit- 或 -moz- 的数字指定使用前缀的第一个版本。

Property
column-rule-width	50.0 4.0 -webkit-	10.0	52.0 2.0 -moz-	9.0 3.1 -webkit-	37.0 15.0 -webkit 11.1

CSS 语法

column-rule-width: medium|thin|thick| length|initial|inherit;

属性值

Value	Description	Demo
medium	Default value. Defines a medium rule	Demo ❯
thin	Defines a thin rule	Demo ❯
thick	Defines a thick rule	Demo ❯
length	Specifies the width of the rule	Demo ❯
initial	Sets this property to its default value. Read about initial
inherit	Inherits this property from its parent element. Read about inherit

更多示例

示例

将 <div> 元素中的文本分为三列：

div {
column-count: 3;
}

亲自试一试 »

示例

指定列之间的间隙为 40 像素：

div {
column-gap: 40px;
}

亲自试一试 »

示例

指定列之间规则的宽度、样式和颜色：

div {
column-rule: 4px outset #ff00ff;
}

亲自试一试 »

相关页面

CSS教程：CSS 多列

HTML DOM 参考：列规则宽度属性

❮上一节完整的CSS参考下一节❯