CSS3 column-rule-style property
Examples
Specify style rules between columns:
div
{
column-rule-style: dotted;
-moz-column-rule-style: dotted; / * Firefox * /
-webkit-column-rule-style: dotted; / * Safari and Chrome * /
}
{
column-rule-style: dotted;
-moz-column-rule-style: dotted; / * Firefox * /
-webkit-column-rule-style: dotted; / * Safari and Chrome * /
}
try it"
In the bottom of this page for more examples.
Browser Support
Figures in the table represent the first browser to support the version number of the property.
Immediately following the digital -webkit-, -ms- or -moz- ago in support of the prefix attribute first browser version number.
属性 | |||||
---|---|---|---|---|---|
column-rule-style | 50.0 4.0 -webkit- |
10.0 | 2.0 -moz- | 9.0 3.1 -webkit- |
37.0 15.0 -webkit 11.1 |
Attribute definitions and instructions
column-rule-style attribute specifies style rules between columns.
Defaults: | none |
---|---|
inherit: | no |
version: | CSS3 |
JavaScript syntax: | object .style.columnRuleStyle = "dotted" |
grammar
column-rule-style: none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset;
value | description |
---|---|
none | There are no rules defined. |
hidden | Hide defined rules. |
dotted | Define the point rules. |
dashed | The dotted line is defined rules. |
solid | Define the real line rules. |
double | Defined rule double. |
groove | 3D grooved defined rules. This effect depends on the width and color values. |
ridge | Define 3D ridged rules. This effect depends on the width and color values. |
inset | 3D inset defined rules. This effect depends on the width and color values. |
outset | 3D outset defined rules. This effect depends on the width and color values. |
More examples
Column-count
Text div element into three columns.
Column-gap
Text in the div element into three columns, and specify the gap between the columns of a 30 pixel.
Column-rule
Rules specify between columns: width, style and color.
related articles
CSS3 tutorial: CSS3 Multiple the Columns