이와 같은 div/카드를 어떻게 배치합니까?

Question

사진과 같은 div 위치를 지정하는 데 문제가 있습니다.

으아아아

이런 것을 시도했지만 CSS를 사용하여 스타일을 지정하고 위치를 지정하는 데 문제가 있습니다.

단일 div의 이름은 처음 두 카드/div의 이름을 따서 지정됩니다. 두 번째 div의 이름은 두 번째 카드/div 아래로 지정됩니다.

Answer 1

CSS 그리드는 이러한 유형의 레이아웃에 도움이 될 수 있습니다. 모델을 기반으로 상자를 배치하는 방법을 보려면 아래 코드를 연구하십시오.

MDN에서 网格模板区域에 대한 다음 섹션을 자세히 살펴보십시오. Leaving Grid Cells Blank

으아악 으아악

자원: CSS 그리드 전체 가이드