Four states in the css style of the a tag

This article mainly introduces the four states in the css style of the a tag. It has certain reference value. Now I share it with you. Friends in need can refer to it.

There are four states in the a tag The sequence of "status" is: a:link ->a:hover ->a:active ->a:visited. In addition, a:active cannot be set with or without an underscore (it is always present). There is an example below that you can look at.

represents connections in all states, such as a{color:red}
① a: link: Unvisited link, such as a:link {color:blue}
② a:visited: Visited link, such as a:visited{color:blue}
③ a:active: When activated (the link gets focus when) the color of the link, such as a:active{color:blue}
④ a:hover: when the mouse moves over the link, such as a:hover {color:blue}
Generally a:hover and a:visited The status of the link (color, underline, etc.) should be the same.
The first three correspond to the link, vlink, and alink attributes of the body element respectively.
The sequence of the four "states" is: a:link ->a:hover ->a:active ->a:visited. In addition, a:active cannot be set with or without underline (it is always present).
Example: Common status values ​​of pseudo-classes

<style type = “text/css”> 
a {font-size:16px} 
a:link {color: blue; text-decoration:none;} //未访问：蓝色、无下划线 
a:active:{color: red; } //激活：红色 
a:visited {color:purple;text-decoration:none;} //已访问：purple、无下划线 
a:hover {color: red; text-decoration:underline;} //鼠标移近：红色、下划线 
</style>

The above is the entire content of this article. I hope it will be helpful to everyone's learning. For more related content, please pay attention to the PHP Chinese website!

Related recommendations:

CSS Introduction to the use of Border attribute solid

Explanation of css mouse style cursor

The above is the detailed content of Four states in the css style of the a tag. For more information, please follow other related articles on the PHP Chinese website!