CSS - 문제 미리보기
문제 1044
hard
다음 HTML과 CSS 코드에서 "Hello World!" 텍스트의 최종 색상은?
```html
```
```css
* {
color: black;
}
p {
color: blue;
}
.text {
color: green;
}
#special {
color: red;
}
```
Hello World!
정답: D
이 문제는 **CSS 우선순위(CSS Specificity)**를 이해하는 중요한 개념입니다.
CSS 우선순위 규칙 (높은 순서부터):
1. 인라인 스타일 (`style="..."`)
2. ID 선택자 (`#special`)
3. 클래스 선택자 (`.text`)
4. 요소 선택자 (`p`)
5. 전체 선택자 (`*`)
각 선택자의 적용:
• `*` → `color: black` (우선순위: 가장 낮음)
• `p` → `color: blue` (요소 선택자)
• `.text` → `color: green` (클래스 선택자)
• `#special` → `color: red` (ID 선택자, 가장 높은 우선순위)
결과: ID 선택자가 가장 높은 우선순위를 가지므로 텍스트는 **빨간색(red)**으로 표시됩니다.
기억법: "ID가 가장 특별하고(Specific), 클래스는 공통적이고, 요소는 일반적이다"
💡 학습 팁
이 문제를 포함한 CSS 과목의 모든 문제를 순차적으로 풀어보세요. 진행상황이 자동으로 저장되어 언제든지 이어서 학습할 수 있습니다.