簡介,語法,取值,說明,寫法,示例,
簡介
column-break-before
語法
column-break-before：auto | always | avoid | left | right | page | column | avoid-page | avoid-column
默認值：auto
取值
auto：
always：
總是在元素之前斷行並產生新列
avoid：
避免在元素之前斷行並產生新列
說明
設定或檢索對象之前是否斷行。
對應的腳本特性為columnBreakBefore。
寫法
核心類型寫法
Webkit(Chrome/Safari)-webkit-column-break-before
Gecko(Firefox)
Presto(Opera)
Trident(IE)column-break-before
W3Ccolumn-break-before
示例
body {
font: 14px / 1.5 georgia,
serif,
sans - serif;
}.test p,
.test div {
margin: 0;
padding: 5px 10px;
background: #eee;
}
h1 {
margin: 10px 0;
font - size: 16px;
}.test {
width: 600px;
border: 10px solid#000; - moz - column - count: 4; - moz - column - gap: 20px; - moz - column - rule: 3px solid#090; - webkit - column - count: 4; - webkit - column - gap: 20px; - webkit - column - rule: 3px solid#090;
column - count: 4;
column - gap: 20px;
column - rule: 3px solid#090;
}.test div { - moz - column -
break - before: always; - webkit - column -
break - before: always;
column -
break - before: always;
}
column -
break - before: always This module describes multi - column layout in CSS By using functionality described in this document,
style sheets can declare that the content of an element is to be laid out in multiple columns.不管上一列有沒有填滿，我都另起一列This module describes multi - column layout in CSS By using functionality described in this document,
style sheets can declare that the content of an element is to be laid out in multiple columns.
