Section (섹션)
Section(섹션) 은 페이지를 가로 줄로 나누는 큰 영역 단위입니다. 웹사이트는 보통 여러 Section이 위에서 아래로 쌓여 이뤄집니다.
전형적인 페이지 구성
┌─────────────────────────┐
│ Section: 헤더 (로고·메뉴) │
├─────────────────────────┤
│ Section: 히어로 (큰 제목·CTA) │
├─────────────────────────┤
│ Section: 기능 소개 │
├─────────────────────────┤
│ Section: 후기 / 가격 │
├─────────────────────────┤
│ Section: 푸터 │
└─────────────────────────┘왜 Section으로 나누나요?
- 구조가 한눈에 — 레이어 패널에서 페이지 흐름이 명확해집니다.
- 영역 단위 수정 — Section째로 순서를 바꾸거나 복제할 수 있습니다.
- 배경·여백 관리 — Section마다 배경색·상하 여백을 따로 줄 수 있습니다.
Section 안에는 보통 Stack을 넣어 내부 요소를 정렬합니다. “Section으로 영역을 나누고, Stack으로 내부를 정렬한다”가 기본 패턴입니다.
다음 단계
Stack (스택)으로 Section 내부를 정렬해보세요.
자주 묻는 질문
Last updated on