The role of a:active in CSS and detailed explanation of its use-CSS Tutorial-php.cn

The role of a:active in CSS and detailed explanation of its use

黄舟

Release： 2017-07-19 16:53:48

Original

16903 people have browsed it

CSS :active selector

Definition and usage

　:active selector is used to select active links.

When you click on a link, it becomes active.

Tip: Please use the :link selector to style links to unvisited pages, :visited to style links to visited pages, and the :hover selector to set the mouse pointer to float to the link. Last style.

Example 1 Select unvisited, visited, floating and active links and set their styles:

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

Copy after login

Example 2 Set different styles for links:

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

Copy after login

Definition The link's style when the mouse is activated (clicked). There are four link pseudo-classes:
a:link normal link style a:visited link visited style a:hover link highlighted (mouse over) style a:active link activated style

Example:

<!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>

Copy after login

The result is: W3Sschool Google Wikipedia
Comments: The :active selector styles active links.
Define the style of the link when the mouse is activated (clicked). There are four link pseudo-classes:
a:link normal link style a:visited link visited style a:hover link highlighted (mouse over) style a:active link activated style

The above is the detailed content of The role of a:active in CSS and detailed explanation of its use. For more information, please follow other related articles on the PHP Chinese website!