伪类标签 · css3

# a标签的伪类 1.概念 a标签可以根据用户的不同行为的触发，从而实现四种状态的样式这4种状态是可以设置的，我们称之为伪类。 a:link 伪类一种 a:visited{ } a:hover{ } a:active{ } ## link 访问前的状态 ## ## visited 访问后的状态 ## ## hover 鼠标悬停状态 ## ## active 鼠标点击状态 # 普通元素的伪类：非超级链接，可以设置伪类状态，此时只有两个状态可以使用，分别是hover和active 伪类选择器:规定一定要先设置好需要的选择器，推荐使用class类名，不会引起冲突，或者使用后代选择器精确匹配，以防打乱页面状态。例子 ``` <a class="box"> 伪类可以设置为 .box:link{ } .box:visited { } .box:hover{ } .box:active{ } ``` 伪类的权重和普通选择器权重是一样的书写顺序 a标签有时会有2-3个触发状态，一定按照书写顺序去执行先 link 再 visited 再 hover 再active 实际应用所有的伪类种，最常用的是hover 一个实际的页面中，为了保持页面的统一状态，此时会将a标签访问前访问后的状态进行统一设置（也就是设置 link和valid为同一个颜色）如代码： ``` a:link,a:valid{ color:rgb(113, 0, 179) } a:hover{ color:crimson; } a:active{ color:rgb(36, 0, 197) } </style> </head> <body> <a href="https://www.baidu.com">点击跳转到百度</a> </body> ```