伪类选择器
一 、伪类
定义：不真实存在的类，是一种特殊的类，它表示的元素的一种状态，不是固定某一定
例如：鼠标悬浮，鼠标点击等
常见的伪类选择器
语法使用‘:’开头
:first-child 第一个元素
:last-child 最后一个元素
:nth-child() 选中第几个元素
span:first-child{
color: red;
}特殊值：
2n或even 偶数
2n+1或odd 奇数
以上这些伪类都是根据所有的子元素进行排序
:first-of-type 第一个元素
:last-of-type 最后一个元素
:nth-of-type() 选中第几个元素
功能跟上面相似，不同的是，这是在同类型的子元素中去选择
二、:not() 否定伪类
将符合条件的元素从选择器中去除
li:not(#l1){
background-color: green;
}a元素的伪类
1、:link 没有访问过的状态
a:link{
color: orange;
}2、:visited 访问过的状态
a:visited{
color: green;
/* 以下样式不生效 */
font-size: 50px;
background-color: pink;
}注意：
1、:link和:visited 是a标签独有的伪类
2、由于隐私问题，:link和:visited只能设置字体颜色
3、:hover 鼠标移入的状态
a:hover{
font-size: 30px;
}4、:active 鼠标点击后的状态
a:active{
background-color: pink;
}注意：
:hover和:active 针对所有的元素
伪元素选择器
1、::first-letter 第一个字母
2、::first-line 第一行
3、::selection 选中的内容
4、::before 在元素的最前面 ，必须要配合content样式名使用
5、::after 在元素的最后面， 必须要配合content样式名使用
p::first-letter {
font-size: 34px;
}
p::first-line {
background-color: yellow;
}
p::selection {
color: red;
}
p::before{
content: "你好";
}
p::after{
content: '你也好啊';
}继承
样式的继承
定义：给父元素或者祖先元素设置有关样式，它会继承到子元素或后代元素上，
优势：一般情况下，样式的继承是对我们开发是有利，不需要额外调整
注意：不是所有的样式都能继承，一般情况布局上样式
共同的祖先元素，设置统一的字体大小、字体颜色、行高、字体等
选择器的权重
样式冲突：给同一个元素设置相同的样式名，不一样的样式值，最终哪个样式有效果，是看选择器的权重，谁的权重高，就有效果
选择器的权重
内联样式 1000
id选择器 100
class选择器/属性选择器 10
元素选择器 1
通配选择器 0
继承样式 没有权重
注意：
1、如果选择器的权重一样，那么谁靠下，就谁生效
2、要让所有选择器的权重相加，最终谁大听谁的
3、所有的选择器权重相加，最高也不会超过上一等级的权重,如再多的类选择器权重相加，也不会超过id选择器权重
4、在并集选择器（群组选择器）当中，选择器权重是各算各的,最终谁大听谁的
5、!important 是最高的权重 但慎用
一般情况下，可以测试使用,测试是否是选择器权重的问题
display
display 实现元素之间的相互转换
可选值：
block 将元素转成块元素
inline 将元素转成行内元素
inline-block 将元素转成行内块元素
none 隐藏元素