CSS GRID

배코딩·2022년 6월 18일
0

note

목록 보기
44/149

통제받지 않는 Column

.item2:nth-child(1){
    grid-column: 2;
}
.item2:nth-child(6){
    grid-column: 7;
}

그리드 라인 2번부터 8번까지의 모든 열이 통제받지 않는 열이 됨
(저 구문 없을 때는 그리드 컨테이너의 열은 한개임)

문법

display: grid;
grid-template-rows
row-gap
grid-auto-columns
grid-column-start
grid-row-end
grid-row: 1 / 4;
grid-column: 2 / span 3;
grid-template-areas:
"header header header"
"a main b"
". . ."
"footer footer footer";
grid-area: a;
grid-auto-flow: row;
align-items
justify-items
place-items
align-content
justify-content
place-content
align-self
justify-self
place-self
order
z-index

profile
PS, 풀스택, 앱 개발, 각종 프로젝트 내용 정리 (https://github.com/minsu-cnu)

0개의 댓글