기본 그리드

grid-template-columns & grid-template-rows

1

2

3

4

5

6

fr단위(fraction), Repeat(), column line과 row line

1

2

3

4

5

6

grid-auto-rows & auto-fit, minmax()

1

2

3

4

5

6

grid-column & grid-row

header
aside
content
footer

grid-template-areas

H
A
C
F

이미지 그리드

grid-auto-flow: dense;