Style columnRuleStyleProperty
Example
Change the style rule between columns:
document.getElementById("myDIV").style.columnRuleStyle="dotted";
Try it Yourself »
Definition and Usage
The columnRuleStyle property specifies the style rule between columns.
Browser Support
![]()
Internet Explorer 10 and Opera support the columnRuleStyle property.
Firefox supports an alternative property, namely the MozColumnRuleStyle property.
Safari and Chrome support an alternative property, namely the WebkitColumnRuleStyle property.
Syntax
Return the columnRuleStyle property:
object.style.columnRuleStyle
Set the columnRuleStyle property:
object.style.columnRuleStyle="none|hidden|dotted|dashed|solid|double|groove|ridge|inset|outset|
initial|inherit"
initial|inherit"
Property Values
| Value | Description |
|---|---|
| none | Default value. Defines no rule. |
| hidden | Defines a hidden rule. |
| dotted | Defines a dotted rule. |
| dashed | Defines a dashed rule. |
| solid | Defines a solid rule. |
| double | Defines a double rule. |
| groove | Specifies a 3D grooved rule. The effect depends on the width and color values. |
| ridge | Specifies a 3D ridged rule. The effect depends on the width and color values. |
| inset | Specifies a 3D inset rule. The effect depends on the width and color values. |
| outset | Specifies a 3D outset rule. The effect depends on the width and color values. |
| initial | Sets this property to its default value. Seeinitial。 |
| inherit | Inherits this property from its parent element. Seeinherit。 |
Technical Details
| Default value: | none |
|---|---|
| Return value: | A string, representing the element's column-rule-style property. |
| CSS Version | CSS3 |
Related Articles
CSS3 Tutorial:CSS3 Multi-columns
CSS Reference Manual:column-rule-style property
Other Extensions
Style Object