項 目 | 説 明 |
---|---|
記述形式 | セレクタ {grid-area: 値 } |
値 の形式 |
|
初 期 値 | 各プロパティの初期値 |
対応ブラウザー | C?+ / e?+ / Fx?+ / Op?+ / Ch?+ / Sa?+ |
適用可能な要素 | グリッド・コンテナ |
継 承 | 各プロパティを参照 |
grid-area プロパティ は,グリッド領域の一括指定 をします。
grid-row-start,grid-column-start, grid-row-end,grid-column-end の4つのプロパティをまとめて指定することが可能です。 これら4つのプロパティそれぞれの詳細については,各プロパティの説明を参照してください。
ただし,grid-row-start プロパティは省略できません。
複数のプロパティを指定するときには,プロパティの後に " / " をはさんで続けて書きます。
値 | 説 明 |
---|---|
grid-column-end | 上の 2 のように,この値を省略した場合,grid-column-start の値が,ID名 のときはそれと同じ値となり,それ以外のときは auto になります。 |
grid-row-end | 上の 3 のように,この値を省略した場合,grid-row-start の値が,ID名 のときはそれと同じ値となり,それ以外のときは auto になります。 |
grid-column-start | 上の 4 のように,この値を省略した場合,grid-row-start の値が,ID名 のときは4つのプロパティは全てそれと同じ値となり,それ以外のときはこのプロパティの値は auto になります。 |
grid-row-start | 上の 1 ~ 4 のように,このプロパティは省略できません。 |
備 考 | これらの4つのプロパティは,グリッド・コンテナの子要素配置のパラメーター,すなわち,グリッド領域内子要素の ブロック開始端(block-start),インライン開始端(inline-start),ブロック終了端(block-end),インライン終了端(inline-end) を指定するプロパティです。 |
現在準備中です。