CSS - 문제 미리보기

문제 1456

medium
버튼에 호버 효과를 부드럽게 만들기 위해 함께 사용하는 속성은? ```css .button { background-color: #04AA6D; _______: 0.4s; } .button:hover { background-color: #45a049; } ```
A. animation-duration
B. transition-duration
C. hover-duration
D. delay-duration

정답: B

transition-duration의 역할: • CSS 속성 변화가 일어나는 시간을 지정 • 호버 효과를 부드럽게 만들어 사용자 경험 향상 전체 호버 효과 구현: ```css .button { background-color: #04AA6D; transition-duration: 0.4s; /* 부드러운 전환 */ /* 또는 transition: all 0.4s; */ } .button:hover { background-color: #45a049; /* 호버시 색상 변경 */ transform: translateY(-2px); /* 살짝 위로 이동 */ } ```

💡 학습 팁

이 문제를 포함한 CSS 과목의 모든 문제를 순차적으로 풀어보세요. 진행상황이 자동으로 저장되어 언제든지 이어서 학습할 수 있습니다.