css链接状态伪类
链接: 文字或者图片等与其他位置或者页面跳转入口，比如：
<a href="url">链接，href就是跳转的（页面）路径</a>
状态（注意顺序）： 访问链接前 --》 访问过的链接--》 鼠标在链接上 --》 点击时的连接
伪类 :link :visited :hover :active
//注意顺序，如果以下伪类同时出现》=2，一定要按以下顺序写
a:link{
//访问前链接
}
a:visited{
//访问过的链接
}
a:hover{
//鼠标悬浮在链接上
}
a:active{
//鼠标点击时的链接
}
伪类 :first-child
适用所有元素，当前类元素的第一个元素
<style>
p:first-child{
//所有p元素中第一个p元素
}
</style>
<body>
<div>
<p>第一个p元素</p>
<p>第二个p元素</p>
<p>第三个p元素</p>
</div>
</body>
伪类 :before
使用所有元素，当前类元素之前(ps：之后:after)插入内容
<style>
p:before{
//所有p元素之前插入
content:"内容文本，当你只需要图形时可以:\"\"。 "
}
</style>
<body>
<div>
<p>看看我的前面是什么？</p>
</div>
</body>
伪类 :after
使用所有元素，当前类元素之后（ps：之前 :before）插入内容
<style>
p:after{
//所有p元素之后插入
content:"内容文本，当你只需要图形时可以:\"\"。 "
}
</style>
<body>
<div>
<p>看看我的前面是什么？</p>
</div>
</body>
input伪类集
伪类 :checked
条件：input标签的type属性为radio||checkbox
<style>
input:checked{
//当元素被选中时，有checked属性，样式
}
</style>
<!--lable的for属性与input的id值相同，点击lable标签会触发input标签-->
<body>
<lable for="ra">方形（打勾）：</lable>
<input type="radio" id="ra" checked>
</lable>
<lable for="check">圆形（小圆点）：</lable>
<input type="checkbox" id="check">
</lable>
</body>
伪类 :focus
适用于input标签（键盘事件||用户输入），当元素具有焦点
input:focus{
//当元素具有焦点时
}
伪类 :disabled
适用于input标签,禁止当前元素
<style>
input:display{
//禁止元素
}
</style>
<body>
<input type="text" display>
</body>
伪类 ：valid
适用于input标签，当input标签输入的内容（value）符合type属性||value为空也符合
<style>
input:valid{
//输入的值符合type属性||value为空
}
</style>
<body>
<input type="email" >
</body>
伪类 :invalid
适用于input标签&&表单客户端验证，当input标签输入的内容（value）不符合type属性（ps:与伪类:valid相反）
input:invalid{
//输入的值不符合type属性
}
</style>
<body>
<input type="email" >
