這篇文章主要介紹了css中column-fill屬性的使用方法,具有一定借鑒價(jià)值,需要的朋友可以參考下。希望大家閱讀完這篇文章后大有收獲。下面讓小編帶著大家一起了解一下。
創(chuàng)新新互聯(lián),憑借十載的網(wǎng)站設(shè)計(jì)制作、網(wǎng)站建設(shè)經(jīng)驗(yàn),本著真心·誠心服務(wù)的企業(yè)理念服務(wù)于成都中小企業(yè)設(shè)計(jì)網(wǎng)站有超過千家案例。做網(wǎng)站建設(shè),選創(chuàng)新互聯(lián)。
css column-gap屬性定義及用法
在css中,column-gap屬性通常和columns、column-count等分列屬性一起使用,用來設(shè)置元素內(nèi)容分列(多列布局)后列與列之間的距離
css column-gap屬性語法格式
css語法:column-gap: length / normal;(例:column-gap:36px;)
JavaScript語法:object.style.columnGap="40px"
css column-gap屬性值說明
length:自定義列之間的間距
normal:列之間的普通差距
實(shí)例
body{background: #ddd;}div{width: 400px;border:1px solid blueviolet;}
.gap{column-count:3;column-gap:60px;}
.gap_normal{column-count:3;column-gap:normal;}
運(yùn)行結(jié)果
感謝你能夠認(rèn)真閱讀完這篇文章,希望小編分享css中column-fill屬性的使用方法內(nèi)容對(duì)大家有幫助,同時(shí)也希望大家多多支持創(chuàng)新互聯(lián),關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道,遇到問題就找創(chuàng)新互聯(lián),詳細(xì)的解決方法等著你來學(xué)習(xí)!