此文章已於 2022-03-08 更新
在撰寫文章段落的時候，通常都是單欄的到底，但是在一些網站，或許是行銷編排，抑或是因為版面的關係，有時會想把段落或是列表（<li>）分成多欄呈現，這時候如果要因為這樣再用其他<div>去包，其實對後續維護及文案改動，都是非常麻煩的，今天介紹一個我很挺喜歡的CSS屬性，可以透過CSS屬性來解決這問題，又何樂而不為呢？
我們先來看一下範例，一般的單欄區塊會是這樣（如下圖）
使用簡單的CSS屬性，就變成了這樣！
接下來，就讓我來介紹一下這個屬性
column-count
可以依據需求來將欄位分成雙欄、三欄甚至更多，填入要欄位數量即可，例如
column-count：2
column-width
除了定義欄位數量，也可以定義欄位的寬度，要注意的是這與上面的屬性只能擇一使用
再來是由這兩個屬性延伸出來的，可以定義欄位間距、色彩等等，介紹幾個我自己常用到的
column-gap
欄位間的間距
column-break-inside
可決定文字的換欄方式
auto: 自動
avoid: 文字段落後換欄
column-rule-style
可以設定欄位間border style
這個屬性適用範圍很廣，也許能解決一些意想不到的狀況，大家趕緊雙擊加關注吧！