CSS 参考手册

CSS @规则(RULES)

columns CSS属性は、同時に設定するためのショートカット属性です。column-widthおよびcolumn-count属性。

以下のテーブルには、この属性の使用方法とバージョン履歴、およびJavaScriptスクリプト内での使用法が示されています。

デフォルト値：	auto auto; すべての属性を表示
適用範囲：	置換されないブロックレベル要素（テーブル要素を除く）、テーブルセルとインラインブロック要素
継承：	ありません
アニメーション可能：	はい、速記の各属性はアニメーション可能です。参照してくださいアニメーション属性。
バージョン：	CSS3の新機能
JavaScriptの構文：	object.style.columns="100px 3"

この属性の構文は以下の通りです：

columns:　[　column-width　column-count　]　|　initial　|　inherit

以下の例では、columns属性の使用方法を示しています。

例

p　{
　　　　-webkit-columns:　150px　3;　/*　Chrome,　Safari,　Opera　*/
　　　　　　　-moz-columns:　150px　3;　/*　Firefox　*/
　　　　　　　　　　　　columns:　150px　3;　
}

以下のテーブルは、この属性の値を説明しています。

値	説明
column-width	多列要素内の列の最適な幅を指定します。
column-count	多列要素内の最適な列数を指定します。
initial	この属性をデフォルト値に設定します。
inherit	指定された場合、関連する要素は親要素のcolumnsの属性値を使用します。

columns属性のブラウザの互換性を確認してください。以下のテーブルには、この属性をサポートするブラウザの最低バージョン番号が示されています；すべての主要ブラウザがこの属性をサポートしています。

	Firefox 2+ ^-moz- Google Chrome 4+ ^-webkit- Internet Explorer 10+ Apple Safari 3.1+ ^-webkit- Opera 11.1+ ^-o-、15+ ^-webkit-

以下のチュートリアルを参照してください：CSS3多列レイアウト。