목록grid-template-areas (1)

data life

grid-template-areas

영역 이름으로 그리드 정의 각 영역(Grid Area)에 이름을 붙이고, 그 이름을 이용해서 배치하는 방법 .container { display: grid; grid-template-columns: repeat(4, 200px); grid-template-rows: 100px repeat(2, 200px) 100px; grid-template-areas: "header header header header" "content content content nav" ". . . ." "footer footer footer footer"; } HTML 삽입 미리보기할 수 없는 소스 빈칸은 마침표(.) 나 “none”을 사용하면 되고, 마침표의 개수는 여러개를 써도 됨! ⭐️ 중요 ⭐️ >> 해당 아이템 요소에 ..
CSS/Grid 2022. 11. 18. 13:07
이전 Prev 1 Next 다음