column-rule-color

column-rule-color CSS 属性确定 CSS 多列布局中列之间线的颜色。

该属性不能单独使用！为了看到颜色，我们需要制作列之间的线——技术上称为“规则”。这需要 column-rule-style 属性。

.columns {
  column-count: 2 600px;
  column-rule-style: solid;
  column-rule-color: #f8a100;
}

或者，我们可以使用 column-rule 简写属性，它将 column-rule-color、column-rule-style 和 column-rule-width 结合到单个声明中。

column-rule: 3px solid #f8a100;

语法

column-rule-color 接受单个颜色值。这可以是任何有效的 CSS 颜色，包括十六进制、RGB、RGBA、HSL、HSLA 和命名颜色。它甚至接受 currentColor 作为值。

column-rule-color: #f8a100;
column-rule-color: hsl(39,100,49);
column-rule-color: rgb(250,162,0);
column-rule-color: aliceblue;
column-rule-color: currentColor;

演示

浏览器支持

IE	Edge	Firefox	Chrome	Safari	Opera
10+	12+	3.5+	4+	3.1+	11.5+

Android Chrome	Android Firefox	Android 浏览器	iOS Safari	Opera Mini
85+	79+	否	3.2+	全部

相关属性

• column-count
• column-fill
• column-gap
• column-rule
• column-rule-style
• column-rule-width
• column-span
• column-width
• columns

规范

CSS 多列布局模块级别 1（编辑草案）