CSS - 문제 미리보기
문제 1366
easy
키보드 사용자와 스크린 리더 사용자를 위해 현재 활성화된 요소를 표시하는 CSS 가상 선택자는?
```css
a_____,
button_____,
input_____ {
outline: 2px solid #005fcc;
outline-offset: 2px;
}
```
```css
a_____,
button_____,
input_____ {
outline: 2px solid #005fcc;
outline-offset: 2px;
}
```
정답: C
• `:focus` 가상 선택자는 접근성에 필수적인 선택자입니다
• 접근성 관점에서 `:focus`의 중요성:
• 키보드만으로 웹사이트를 탐색하는 사용자를 위함
• 스크린 리더 사용자가 현재 위치를 파악할 수 있도록 함
• 시각적 피드백을 통한 사용자 경험 향상
• 다른 가상 선택자들과의 차이:
• `:hover`: 마우스 오버 시에만 적용 (키보드 사용자에게는 소용없음)
• `:active`: 클릭하는 순간에만 적용 (지속적이지 않음)
• `:visited`: 방문한 링크에 적용 (현재 상태와 무관)
• 접근성 관점에서 `:focus`의 중요성:
• 키보드만으로 웹사이트를 탐색하는 사용자를 위함
• 스크린 리더 사용자가 현재 위치를 파악할 수 있도록 함
• 시각적 피드백을 통한 사용자 경험 향상
• 다른 가상 선택자들과의 차이:
• `:hover`: 마우스 오버 시에만 적용 (키보드 사용자에게는 소용없음)
• `:active`: 클릭하는 순간에만 적용 (지속적이지 않음)
• `:visited`: 방문한 링크에 적용 (현재 상태와 무관)
💡 학습 팁
이 문제를 포함한 CSS 과목의 모든 문제를 순차적으로 풀어보세요. 진행상황이 자동으로 저장되어 언제든지 이어서 학습할 수 있습니다.