CSS 參考手冊

CSS @規(guī)則(RULES)

CSS 屬性大全

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

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

column-rule-width CSS屬性設(shè)置在多列布局的列之間繪出的規(guī)則的寬度。

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

默認(rèn)值：	medium
適用于：	多列元素
繼承：	沒有
可動畫制作：	是。請參考動畫屬性。
版本：	CSS3的新功能
JavaScript語法：	object.style.columnRuleWidth="thin"

column-rule-width的使用語法

該屬性的語法如下：

column-rule-width: length | medium | thin | thick | initial | inherit

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

示例

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

測試看看?/?

屬性值

下表描述了此屬性的值。

值	描述
length	以絕對或相對單位表示的長度，用于指定規(guī)則的寬度。
medium	定義一個中等規(guī)則。這是默認(rèn)值。
thin	定義一個細(xì)規(guī)則。寬度小于默認(rèn)值。
thick	定義一個嚴(yán)格的規(guī)則。寬度大于默認(rèn)值。
initial	將此屬性設(shè)置為其默認(rèn)值。
inherit	如果指定，則關(guān)聯(lián)元素采用其父元素column-rule-width的屬性值。

瀏覽器兼容性

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

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

進(jìn)一步閱讀

請參考以下教程：CSS3多列布局。

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

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