> 웹 프론트엔드 > CSS 튜토리얼 > CSS 호버를 사용하여 마우스 오버 시 앵커 태그에 밑줄을 긋는 방법은 무엇입니까?

CSS 호버를 사용하여 마우스 오버 시 앵커 태그에 밑줄을 긋는 방법은 무엇입니까?

Barbara Streisand
풀어 주다: 2024-12-03 15:35:12
원래의
593명이 탐색했습니다.

How Can I Use CSS Hover to Underline an Anchor Tag on Mouseover?

CSS의 'hover' 속성 익히기

CSS의 'hover' 속성을 사용하면 요소에 스타일 변경을 적용할 수 있습니다. 그 위에 마우스 포인터를 올려 놓습니다. 그러나 이 기능을 구현하는 것이 때로는 어려울 수 있습니다.

코드 조각에서 앵커 태그 위로 마우스를 가져갈 때 앵커 태그에 밑줄을 표시하려고 했습니다. 불행히도 귀하의 접근 방식은 실패했습니다. 이를 수정하려면 아래의 올바른 구문을 고려하세요.

a:hover {
  text-decoration: underline;
}
로그인 후 복사

또는 'hover'라는 클래스 이름을 사용하려는 경우 다음을 사용할 수 있습니다.

a.hover:hover {
  text-decoration: underline;
}
로그인 후 복사

그동안 클래스 이름을 사용하는 것이 매력적으로 보일 수 있지만 이 경우 'a:hover' 의사 요소가 동일한 효과를 달성하므로 추가 목적을 제공하지 않습니다. 클래스 이름을 사용하는 특별한 이유가 없다면 전자의 접근 방식을 권장합니다.

위 내용은 CSS 호버를 사용하여 마우스 오버 시 앵커 태그에 밑줄을 긋는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿