Grid
gap은 column gap, row gap이 있다. gap은 띄워주는 부분을 말함.
grid-contatiner안에 item들이 있는 것을 볼 수 있다.
display:grid를 주면 grid가 적용된다.
위 그림을 보면 item1이 2칸을 적용되고 있다.
grid-column-start랑 grid-column-end를 적용해서 item1이 그리드 1부터 3까지 적용이 되는거다.
'개발일지 > HTML&CSS' 카테고리의 다른 글
[19] Position CSS (1) | 2024.11.23 |
---|---|
[18] display:table (0) | 2024.11.23 |
[16] Flexbox (flex-direction, flex-wrap, flex-flow, justify-content, align-items, align-content, align-self, flex item order, flex-grow, flex-shrink, flex-basis, flex) (0) | 2024.11.23 |
[15] background-clip (1) | 2024.11.22 |
[14] animation CSS (0) | 2024.11.22 |