4、列間距column-gap
column-gap主要用來設置列與列之間的間距。
語法槼則如下:
column-gap: normal || <length>
取值說明:
屬性值 | 屬性值說明 |
normal | 默認值,默認值爲1em(如果你的 字號是px,,其默認值爲你的font-size值)。 |
<length> | 此值用來設置列與列之間的距離,其可以使用px、em單位的任何整數值,但不能是負值。 |
例如:將内容分三列顯列,列與列之間的間距爲2em,實現代碼爲:
column-count: 3; column-gap: 2em;
style.css代碼:
.columns{ paddding:5px; border:1px solid green; width:900px; margin:20px auto; -webkit-column-count:3; -moz-column-count:3; -o-column-count:3; -ms-column-count:3; column-count:3; -webkit-column-gap:3em; -moz-column-gap:3em; -o-column-gap:3em; -ms-column-gap:3em; column-gap:3em; }