CSS - 문제 미리보기
문제 1502
easy
3개의 동일한 너비 컬럼을 만들려면 빈칸에 무엇을 입력해야 할까요?
```css
.grid-container {
display: grid;
grid-template-columns: _______;
}
```
정답: D
동일한 너비 컬럼을 만드는 다양한 방법:
• 1fr 1fr 1fr:
• `fr` (fraction) 단위 사용
• 사용 가능한 공간을 1:1:1 비율로 분배
• 가장 권장되는 방법
• auto auto auto:
• 각 컬럼이 콘텐츠에 맞춰 자동 크기 조정
• 콘텐츠가 동일하면 같은 크기가 됨
• 33% 33% 33%:
• 백분율로 명시적 크기 지정
• 컨테이너 너비의 33%씩 차지
• 실무에서 권장하는 방법: `1fr 1fr 1fr`
• 반응형 디자인에 최적화
• 남은 공간을 효율적으로 활용
• 간격(gap)이 있어도 자동으로 계산
• 단축 문법: `repeat(3, 1fr)`으로 더 간단히 작성 가능
💡 학습 팁
이 문제를 포함한 CSS 과목의 모든 문제를 순차적으로 풀어보세요. 진행상황이 자동으로 저장되어 언제든지 이어서 학습할 수 있습니다.