>웹 프론트엔드 >CSS 튜토리얼 >CSS에서 a:active의 역할과 사용법에 대한 자세한 설명

CSS에서 a:active의 역할과 사용법에 대한 자세한 설명

黄舟
黄舟원래의
2017-07-19 16:53:4816900검색

CSS :active selector

정의 및 사용법

  :active selector는 활성 링크를 선택하는 데 사용됩니다.

 링크를 클릭하면 활성화됩니다.

팁: 방문하지 않은 페이지를 가리키는 링크 스타일을 설정하려면 :link 선택기를 사용하고, 방문한 페이지에 대한 링크 스타일을 설정하려면 :visited를 사용하고, 마우스 포인터가 떠 있을 때의 스타일을 설정하려면 :hover 선택기를 사용하세요. 링크.

예제 1 미방문, 방문, 부동 및 활성 링크를 선택하고 스타일을 설정합니다:

a:link{color:blue;}
a:visited{color:blue;}
a:hover{color:red;}
a:active{color:yellow;}

예제 2 링크에 대해 다양한 스타일 설정:

a.ex1:hover,a.ex1:active {color:red;}
a.ex2:hover,a.ex2:active {font-size:150%;}

마우스가 활성화될 때(클릭) 링크의 스타일을 정의합니다. 네 가지 링크 의사 클래스가 있습니다.
a:링크 일반 링크 스타일 a:방문된 링크 방문한 스타일 a:호버 링크 강조 표시(마우스 오버) 스타일 a:활성 링크 활성 스타일

예:

<!DOCTYPE html>
<html>
<head>
<style>
a:active
{
background-color:yellow;
}
</style>
</head>
<body>

<a href="http://www.w3school.com.cn">W3Sschool</a>
<a href="http://www.google.com">Google</a>
<a href="http://www.wikipedia.org">Wikipedia</a>

<p><b>注释:</b>:active 选择器为活动的链接设置样式。</p>

</body>
</html>

결과는 다음과 같습니다: W3Sschool Google Wikipedia
참고: :active 선택기는 활성 링크 스타일을 지정합니다.
마우스 활성화(클릭) 시 링크 스타일을 정의하세요. 네 가지 링크 의사 클래스가 있습니다.
a:링크 일반 링크 스타일 a:방문된 링크 방문한 스타일 a:호버 링크 강조 표시(마우스 오버) 스타일 a:활성 링크 활성화 스타일

위 내용은 CSS에서 a:active의 역할과 사용법에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.