CSS - 문제 미리보기
문제 1223
hard
다음 CSS 코드가 적용된 테이블 셀의 최종 정렬 상태는?
```css
th {
text-align: left;
vertical-align: top;
height: 60px;
}
td {
text-align: center;
vertical-align: bottom;
height: 40px;
}
```
정답: A
각 CSS 규칙의 최종 효과:
헤더 셀 (th) 분석:
• text-align: left → 수평으로 왼쪽 정렬
• vertical-align: top → 수직으로 상단 정렬
• height: 60px → 높은 셀에서 상단 정렬 효과 확실히 보임
• 결과: 왼쪽 상단 정렬
데이터 셀 (td) 분석:
• text-align: center → 수평으로 가운데 정렬
• vertical-align: bottom → 수직으로 하단 정렬
• height: 40px → 적당한 높이에서 하단 정렬
• 결과: 가운데 하단 정렬
실무에서의 활용:
• 헤더를 상단 정렬하면 데이터와 명확히 구분
• 숫자 데이터를 하단 정렬하면 소수점 맞춤 효과
• 높이가 다른 셀들 간의 시각적 일관성 확보
💡 학습 팁
이 문제를 포함한 CSS 과목의 모든 문제를 순차적으로 풀어보세요. 진행상황이 자동으로 저장되어 언제든지 이어서 학습할 수 있습니다.