| 属性名 | grid-template |
|---|---|
| 値 |
none | [ <grid-template-rows> / <grid-template-columns> ] | [ <line-names>? <string> <track-size>? <line-names>?]+ [ / <explicit-track-list> ]? |
| 値の詳細 |
<track-size> = <track-breadth> | minmax( <min> , <max> ) | fit-content( <limit> ) <explicit-track-list> = [ <line-names>? <track-size> ]+ <line-names>? <min> = <inflexible-breadth> <max> = <track-breadth> <limit> = <length> | <percentage> <inflexible-breadth> = <length> | <percentage> | min-content | max-content | auto <track-breadth> = <inflexible-breadth> | <flex> <line-names> = [ <custom-ident>* ] |
| 初期値 | none |
| 適用可能要素 | グリッドコンテナ |
| 継承 | 継承しない |
| CSS | IE | Edge | Firefox | Chrome | Opera | Safari |
|---|---|---|---|---|---|---|
| CSS3 | × | 16 | 52 | 57 | 44 | 10.1 |
grid-template-rows と grid-template-columns をまとめて指定します。
.grid-container {
display: grid;
grid-template: 1fr 1fr / 1fr 1fr;
}