CSS - 문제 미리보기
문제 1076
hard
다음 두 방법 중 차이점에 대한 설명으로 올바른 것은?
```css
/* 방법 A */
.box {
background-color: green;
opacity: 0.5;
}
/* 방법 B */
.box {
background-color: rgba(0, 128, 0, 0.5);
}
```
정답: B
이 두 방법은 시각적으로 비슷해 보이지만 자식 요소에 미치는 영향이 다릅니다.
방법 A: opacity 속성
```css
opacity: 0.5;
```
• 요소 전체가 50% 투명해짐
• 자식 요소들도 모두 같은 투명도를 상속
• 텍스트, 이미지 등 모든 내용이 투명해짐
• 결과: 내부 텍스트를 읽기 어려울 수 있음
방법 B: RGBA
```css
background-color: rgba(0, 128, 0, 0.5);
```
• 배경색만 50% 투명해짐
• 자식 요소들은 영향받지 않음
• 텍스트는 여전히 선명하게 보임
• 결과: 가독성이 좋음 ✓
실무 권장사항: 배경만 투명하게 하고 싶다면 RGBA를 사용하고, 요소 전체를 투명하게 하고 싶다면 opacity를 사용합니다.
💡 학습 팁
이 문제를 포함한 CSS 과목의 모든 문제를 순차적으로 풀어보세요. 진행상황이 자동으로 저장되어 언제든지 이어서 학습할 수 있습니다.