原生滑动选择器 html,html选择器

常用选择器

元素选择器：根据标签名来选择指定的元素，语法：标签名{}

例：p{} h1{} div{}

p{

color: red;

}

h1{

color: blueviolet;

}

id选择器

作用：根据id属性值选中一个元素

语法：#id属性值{}

例：#box{}

#red{

color:red;

}

.red{

color: red;

}

类选择器

作用：根据元素的class属性值选中一组元素

语法：.class属性值{}

通配选择器

作用：选中页面中的所有选择器

语法：*{}

*/

*{

color:red;

}

复合选择器

交集选择器：

作用：选中同时符合多个条件的元素

语法：选择器1选择器2选择器3…

注意：交集选择器中如果有元素选择器，必须以元素选择器开头

div.red{

font-size: 30px;

}

选择器分组(并集选择器)

作用：选择多个选择器对应的元素，逗号连接

h1,span{

color:green;

}

关系选择器

子元素选择器

作用：选中指定父元素的指定子元素

语法：父元素>子元素

兄弟元素选择器：

选择下一个兄弟

语法：前一个+后一个

选择下边所有的兄弟元素

前一个~后一个

属性选择器

[属性名]选择包含指定属性的元素

[属性名=属性值] 选择指定属性为指定属性名的元素

[属性名^=属性值] 选择属性以指定属性名开头的元素

[属性名$=属性值] 选择属性以指定属性名开头的元素

[属性名*=属性值] 选择属性名中包含指定属性名的元素

伪类的选择器

伪类(不存在的类，特殊的类)

用于描述元素的特殊状态

比如，第一个子元素，被点击的元素，鼠标移入的元素

伪类一般情况下以：开头

：first-child

以上这些伪类都是根据所有子元素进行排序的，

比如 ul>li:first-child表示ul的firstchild是li的子元素

:first-of-type

:last-of-type

:nth-of-type()

以上为类的功能和上述类似，不同点是他们在同类型元素中进行排序

:not()否定伪类

将符合条件的元素从选择器中删除

超链接的伪类

:link用来表示没访问过的链接(正常的链接)

:visited用来表示访问过的链接

由于隐私的原因，visited伪类只能修改链接的颜色

:active用来表示鼠标点击

visited和link是a标签独有的属性

hover和active所有属性共有

:hover 用来表示鼠标移入的状态

伪元素：表示页面中一些并不真实存在的元素(特殊位置)

伪元素使用::开头

::first-letter表示第一个字母

::first-line表示第一行

::after元素的结束位置

::before

标签：伪类,color,元素,html,选择器,red,属性

来源： https://blog.csdn.net/weixin_51235620/article/details/116901766