CSS 參考手冊(cè)

CSS @規(guī)則(RULES)

CSS 屬性大全

CSS3 column-rule-style 屬性 CSS3 column-rule 屬性

CSS3 column-rule-color 屬性使用方法及示例

column-rule-color CSS屬性設(shè)置在多列布局中的列之間繪制的所有規(guī)則的顏色。

下表為此屬性的用法說(shuō)明和版本歷史記錄，以及該屬性在javascript腳本中的使用語(yǔ)法。

默認(rèn)值：	當(dāng)前color元素值
適用于：	多列元素
繼承：	沒(méi)有
可動(dòng)畫(huà)制作：	是。請(qǐng)參考動(dòng)畫(huà)屬性。
版本：	CSS3的新功能
JavaScript語(yǔ)法：	object.style.columnRuleColor="#ff00ff"

列規(guī)則顏色的使用語(yǔ)法

該屬性的語(yǔ)法如下：

column-rule-color: color | initial | inherit

下面的示例演示了如何使用column-rule-color屬性。

示例

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;
}

測(cè)試看看?/?

屬性值

下表描述了此屬性的值。

值	描述
color	指定列規(guī)則的顏色。接受任何有效的CSS顏色值。
initial	將此屬性設(shè)置為其默認(rèn)值。
inherit	如果指定，則關(guān)聯(lián)元素采用其父元素column-rule-color的屬性值。

瀏覽器兼容性

column-rule-color屬性瀏覽器的兼容性，下表中的數(shù)字表示支持該屬性的瀏覽器最低版本號(hào)；所有主流瀏覽器均支持該屬性。

	Firefox 2+ ^-moz- Google Chrome 4+ ^-webkit- Internet Explorer 10+ Apple Safari 3.1+ ^-webkit- Opera 11.1+ ^-o-，15+ ^-webkit-

進(jìn)一步閱讀

請(qǐng)參考以下教程：CSS3多列布局。

相關(guān)屬性：column-width，column-fill，column-gap，column-rule，column-rule-width，column-rule-style，column-span，column-count，columns。

CSS3 column-rule-style 屬性 CSS3 column-rule 屬性