English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
column-rule-Usage and examples of the color attribute
The color CSS property sets the color of all rules drawn between columns in multi-column layout.
The table below provides usage instructions and version history of this attribute, as well as its usage syntax in JavaScript scripts. | Default value:colorCurrent |
---|---|
Element value | Applies to: |
Multi-column elements | Inheritance: |
No | Animatable:is. Please refer to. |
Animation properties | CSS3Version: |
New feature of | object.style.columnRuleColor="#ff00ff" |
The syntax of this attribute is as follows:
column-rule-color: color | initial | inherit
The following examples demonstrate how to use column-rule-color attribute.
p { /* Chrome, Safari, Opera */ -webkit-column-count: 3; -webkit-column-gap: 100px; -webkit-column-rule-color: red; -webkit-column-rule-width: 2px; -webkit-column-rule-style: solid; /* Firefox */ -moz-column-count: 3; -moz-column-gap: 100px; -moz-column-rule-color: red; -moz-column-rule-width: 2px; -moz-column-rule-style: solid; column-count: 3; column-gap: 100px; column-rule-color: red; column-rule-width: 2px; column-rule-style: solid; }Test and see‹/›
The table below describes the value of this attribute.
Value | Description |
---|---|
color | Specify the color of the column rule. Accepts any validCSS color value. |
initial | Set this property to its default value. |
inherit | If specified, the associated element adopts its parent element's column-rule-The value of the color attribute. |
column-rule-The compatibility of the color attribute across browsers, the numbers in the table below represent the minimum version number of the browser that supports this attribute; all mainstream browsers support this attribute.
|
Please refer to the following tutorials:CSS3Multi-column layout.
Related properties:column-width,column-fill,column-gap,column-rule,column-rule-width,column-rule-style,column-span,column-count,columns.