display:grid (1) 썸네일형 리스트형 [publishing] display: grid; 에 대하여 display: flex; 와 비슷한 성질인 듯하나 display: grid; 는 말그대로 웹 디자인에서 사용하는 그리드 개념과 비슷하다. flex 처럼 부모에 display: grid;를 설정 한 후, 그 안의 items을 정렬하는 스타일을 추가한다. 1 2 3 4 5 6 7 8 grid-template-columns: repeat(4, 1fr); grid-template-columns 는 각 그리드 아이템의 너비를 결정한다. 테이블에서 column를 생각하면 쉽다. grid-template-columns: repeat(4, 1fr); 은 grid-template-columns: 1fr 1fr 1fr 1fr;와 같은 말이다. - repeat()를 사용하면 그리드가 많이 분할될 경우 간략하게 스타일을 추.. 이전 1 다음
