CSS

The CSS columns property is used to divide the text inside an element into multiple columns.

columns

　columnsプロパティは、要素内のテキストを複数の列に分割するために使用されます。このプロパティを使用することで、ページのレイアウトを改善し、読みやすさを向上させることができます。

　columnsプロパティは、以下のような構文を持っています。

CSS

div {
	columns: <column-width> <column-count>;
}

　<column-width>は、各カラムの幅を指定するための値です。この値は、ピクセル、パーセント、emなどの単位で指定することができます。例えば、以下のように指定することができます。

CSS

div {
	columns: 200px 3;
}

　この場合、各カラムの幅は 200ピクセルに設定され、3列に分割されます。

　<column-count>は、カラムの数を指定するための値です。この値は、整数で指定することができます。例えば、以下のように指定することができます。

CSS

div {
	columns: auto 2;
}

　この場合、カラムの幅は自動で設定され、2列に分割されます。

　また、columnsプロパティには、以下のオプションがあります。