CSS——伪类选择器

1、anchor伪类：专用于控制链接的显示效果

:link	a:link	选择所有未被访问的链接。
:visited	a:visited	选择所有已被访问的链接。
:active	a:active	选择活动链接。
:hover	a:hover	选择鼠标指针位于其上的链接。

例子：

<style>
           a:link{
               color: red;
           }
           a:visited{
               color: coral;
           }
           a:hover{
               color: blue;
           }
           a:active{
               color: rebeccapurple;
           }
 
</style>

2、before after伪类

:first-child	p:first-child	选择属于父元素的第一个子元素的每个元素。
:last-child	p:last-child	选择属于其父元素最后一个子元素每个元素。
:before	p:before	在每个元素的内容之前插入内容。
:after	p:after	在每个元素的内容之后插入内容。

例子：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
 
    <style>
 
        .c1 p:first-child{
            color: red;
        }
 
        .c1 div:last-child{
            color: red;
        }
 
        p#i1:after{
            content:"hello";
            color:red;
            display: block;
        }
 
    </style>
 
 
</head>
<body>
 
<div class="c1">
    <p>item1</p>
    <p>item1</p>
    <div>item1</div>
    <p>item1</p>
</div>
 
<p id="i1">p标签</p>
 
</body>
</html>