:link 用来表示未访问过的链接
:visited 用来表示访问过的链接
注意:由于隐私问题,大部分的浏览器对访问的链接,只能设置颜色
:hover 鼠标移入的效果
:active 鼠标点击效果
注意:
1:link visited 只对a标签产生效果,hover active 对所有标签都可以产生效果
2:如果要同时设置这四个伪类,那么伪类是有顺序要求的
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
/* 需求一:给未访问过的超链接加红色 */
/* 需求二:给访问过的超链接加绿色 */
/* 需求三:鼠标移入到元素后,字体变橘色 */
/* 需求四:点击超链接的时候,字体变大30px */
p:hover{
background-color: orchid;
}
a:link{
color: red;
}
a:visited{
color: green;
}
a:hover{
color: orange;
}
a:active{
font-size: 30px;
}
</style>
</head>
<body>
<!-- <a href="#">超链接</a> -->
<a href="https://www.mi.com/">小米</a>
<a href="./测试1.html">测试1</a>
<a href="./测试2.html">测试2</a>
<p>哈啊哈哈</p>
</body>
</html>