列规定颜色 | column-rule-color
column-rule-color
column-rule-colorCSS属性可以让你设置的“规则”或行多列布局列之间绘制的颜色。
/* <color> values */
column-rule-color: red;
column-rule-color: rgb(192, 56, 78
column-rule-color: transparent;
column-rule-color: hsla(0, 100%, 50%, 0.6
/* Global values */
column-rule-color: inherit;
column-rule-color: initial;
column-rule-color: unset;
| 初始值 | currentcolor |
|---|---|
| 适用于 | multicol elements |
| 遗传 | 没有 |
| 媒体 | visual |
| 计算值 | 计算的颜色 |
| 动画类型 | 一个颜色 |
| 规范的顺序 | 逐个语法 |
语法
单一的<color>价值。
值
<color>是<color>表示规则分隔列颜色的值。
形式语法
<color>where
<color> = <rgb()> | <rgba()> | <hsl()> | <hsla()> | <hex-color> | <named-color> | currentcolor | <deprecated-system-color>
where
<rgb()> = rgb( [ [ <percentage>{3} | <number>{3} ] [ / <alpha-value> ]? ] | [ [ <percentage>#{3} | <number>#{3} ] , <alpha-value>? ] )
<rgba()> = rgba( [ [ <percentage>{3} | <number>{3} ] [ / <alpha-value> ]? ] | [ [ <percentage>#{3} | <number>#{3} ] , <alpha-value>? ] )
<hsl()> = hsl( [ <hue> <percentage> <percentage> [ / <alpha-value> ]? ] | [ <hue>, <percentage>, <percentage>, <alpha-value>? ] )
<hsla()> = hsla( [ <hue> <percentage> <percentage> [ / <alpha-value> ]? ] | [ <hue>, <percentage>, <percentage>, <alpha-value>? ] )
where
<alpha-value> = <number> | <percentage>
<hue> = <number> | <angle>
例
#header {
column-rule-color: blue;
}
规范
| Specification | Status | Comment |
|---|---|---|
| CSS Multi-column Layout ModuleThe definition of 'column-rule-color' in that specification. | Candidate Recommendation | |
浏览器兼容性
| Feature | Chrome | Edge | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
|---|---|---|---|---|---|---|
| Basic support | (Yes)-webkit 50.01 | (Yes)-webkit (Yes) | 3.5 (1.9.1)-moz 52.0 (52.0)2 | 10 | 11.10 | 3.0 (522)-webkit |
| Feature | Android | Android Webview | Edge | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile | Chrome for Android |
|---|---|---|---|---|---|---|---|---|
| Basic support | ? | ? 50.01 | (Yes)-webkit (Yes) | (Yes) 52.0 (52.0)2 | ? | ? | ? | ? 50.01 |
