[HTML/CSS] Flex, Grid를 활용한 레이아웃 생성

개념 ✅ Flex: 단순한 가변 영역 ✅ Grid: 복잡한 고정 영역 2차 시도 ▶️ 목표: Grid로 전체 틀 잡고, 내부는 가변 성격에 따라 Flex로 구현 2-3: 완성 (Grid > Flex) CODE 2-1-1: 핵심 클래스 중심 선언 ✅ 사전 정의한 형태로 레이아웃의 구조 규칙을 선언 ⭕ 각각의 영역이 독립적으로 구현되어 디버깅 이점 ❌ CSS 규칙 생성 및 영역 생성 시 코드 지저분 CODE 더보기 1차 시도 더보기 1차 시도: source text #result { width: 1000px; height: 600px; } [class*="box"] { border: solid 1px; } .grid { display: grid; height: 200px; } .garea1 { grid-co..

2023.07.13