layout-grid-mode
CSSの書き方
layout-grid-mode:値 ;
| CSSの詳細情報 | |||||
|---|---|---|---|---|---|
| プロパティ名 | layout-grid-mode | 読み方 | レイアウト・グリッド・モード | ||
| 初期値 | both | 意味 | 文字のマス目配置 | ||
| 値 | both/none/line/char | ||||
| 対象 | ブロックレベル要素 | ||||
| CSSレベル | IE独自 | 対応ブラウザ | Windows | MAC | |
| 継承 | する | IE 5.0以上 | — | ||
解説
「layout-grid-mode」プロパティは、文字を原稿用紙などのマス目のように配置するスタイルシートです。
グリッド系のプロパティはIE独自のプロパティとなっているため、現在はこのプロパティもInternetExplorer専用のCSSとなっていますので使用の際には注意してください。
また、「layout-grid-mode」プロパティは単体では動作しません。「layout-grid-char」や「layout-grid-line」プロパティによって、別途、行や列の間隔を調整する必要があります。
値
「layout-grid-mode」プロパティで指定できる値は全部で4種類です。
以下の表のようになっています。
| 値 | 配置 |
|---|---|
| none | 通常の配置（マス目配置ではない） |
| line | 文章の行だけマス目で配置 |
| char | 文章の列だけマス目で配置 |
| both | 行と列両方マス目で配置 |
CSSレベル3で実装予定
「layout-grid-mode」プロパティと同じようなスタイルシート（line-grid-mode）がCSSレベル3で実装予定だそうです。
CSS/HTMLサンプル
p { layout-grid-mode:both; layout-grid-line:0.5em; layout-grid-char:0.5em; width:500px; background:#ffdff9; }
段落要素内の文字列をグリッド配置 サンプル
