Pseudo-class selectors applied to <a> tags (link, visited, active, hover)

       CSS3 can divide selectors into tag selectors, class selectors, ID selectors, global selectors, combination selectors, inheritance selectors and pseudo-class selectors according to the purpose of selectors. The style defined by the pseudo-class selector is most often applied to the <a> tag, which represents 4 different states: link (unvisited link), visited (visited link), active (active link), hover (the mouse is over the link) link). The <a> tag can have only one state link, or two or three states at the same time.

<body>  
   <a href="#">空链接</a>
   <a href="www.baidu.com">百度</a>
   <style type="text/css">
       a:link{color:#FF0000; text-decoration:none}
       a:visited{color:#00FF00; text-decoration:none}
       a:hover{color:#0000FF; text-decoration:underline}
       a:active{color:#FF00FF; text-decoration:underline}
   </style>
</body>

The effect diagram is as follows:

 

       The above style sheet shows that the link is red and ununderlined when it is not visited, green and ununderlined when it is visited, blue and underlined when the link is activated, and purple and underlined when the link is clicked by the mouse .


Guess you like

Origin http://43.154.161.224:23101/article/api/json?id=324497918&siteId=291194637