visual design. Adjust the Hover State of an Anchor Tag

 

앵커 태그의 호버 상태 조정

이 문제는 의사 클래스의 사용에 대해 다룰 것입니다. 의사 클래스는 요소의 특정 상태를 선택하기 위해 선택기에 추가할 수 있는 키워드입니다.

예를 들어, 앵커 태그의 스타일은 :hover 의사 클래스 선택기를 사용하여 해당 호버 상태에 대해 변경할 수 있습니다. 다음은 호버 상태에서 앵커 태그의 색상을 빨간색으로 변경하는 CSS입니다.

 

a:hover { color: red; }

---

 

코드 편집기에는 모든 태그의 스타일을 검은색으로 지정하는 CSS 규칙이 있습니다. 사용자가 태그 위로 마우스를 가져가면 색상이 파란색이 되도록 규칙을 추가합니다.

 

<style>
  a {
    color: #000;
  }
  a:hover {
    color: blue;
  }



</style>
<a href="https://freecatphotoapp.com/" target="_blank">CatPhotoApp</a>