5、列表邊框column-rule
column-rule主要是用來定義列與列之間的邊框寬度、邊框樣式和邊框顔色。有點類似於常用的border屬性。
但column-rule是不佔用任何空間位置的，在列與列之間改變其寬度不會改變任何列的位置。
語法槼則：
column-rule:<column-rule-width>|<column-rule-style>|<column-rule-color>
取值說明：
| 屬性值 | 屬性值說明 |
| column-rule-width | 類似於border-width屬性，主要用來定義列邊框的寬度，其默認值爲“medium”，column-rule-width屬性接受任意浮點數，但不接收負值。但也像border-width屬性一樣，可以使用關鍵詞：medium、thick、thin |
| column-rule-style | l類似於border-style屬性，主要用來定義列邊框樣式，其默認值爲“none”。column-rule-style屬性值與border-style屬性值相同，包括none、hidden、dotted、dashed、solid、double、groove、ridge、inset、outset。 |
| column-rule-color | 類似於border-color屬性，主要用來定義列邊框顔色，其默認值爲前景色color的值，使用時相當於border-color。column-tule-color接受所有的顔色。如果不希望顯示顔色，也可以將其設置爲transparent（透明色）。 |
例如：爲了能有效區分欄目列之間的關係，可以爲其設置一個列邊框。
代碼爲：
column-rule: 2px dotted green;
實例代碼：
.columns{
padding:5px;
border:1px solid green;
width:900px;
margin:20px;
-webkit-column-count:3;
-mozt-column-count:3;
-o-column-count:3;
-mst-column-count:3;
column-count:3;
-webkit-column-gap:2em;
-moz-column-gap:2em;
-o-column-gap:2em;
-ms-column-gap:2em;
column-gap:2em;
-webkit-column-rule:3px solid gray;
-moz-column-rule:3px solid gray;
-o-column-rule:3px solid gray;
-ms-column-rule:3px solid gray;
column-rule:3px solid gray;
}
