css基础选择器

1、作用
规范了页面中哪些元素能够使用定义好的样式
同时也帮助我们去匹配页面上的元素
2、选择器
1、通用选择器(了解)
1、作用
匹配页面上所有的元素
2、语法
*{样式声明;}
3、注意
效率低，尽量不用
尽可能通过 继承性 去代替通用选择器的效果
2、元素选择器
又名：标签选择器，标记选择器
1、作用
匹配页面某一指定元素
比如：
页面所有的 div 元素
页面所有的 p 元素
2、语法
元素{}
ex:
h1{color:red;}
h2{color:blue;}
3、类选择器(重点)
1、作用
允许元素使用附带的class属性值，对选择器进行引用
2、语法
以 . 作为开始
.类名{}

				类名：字母，数字，_,-组成,不能以数字开始

				引用类选择器:通过元素的 class 属性，进行引用
				<ANY class="类名"></ANY>

3、特殊用法-分类选择器
设置class值为redColor的p元素的 背景颜色为 Yellow
1、作用
将 元素选择器和类选择器结合到一起，从而实现对某种元素的不同样式的细分控制
2、语法
元素选择器.类选择器{
样式声明;
}
p.redColor{
background-color:yellow;
}
4、特殊引用-多类选择器
1、作用
可以让一个元素同时引用多个类选择器,中间用空格分开即可
4、id选择器(重点)
1、作用
只匹配指定ID值得元素
2、语法
#id值{}
5、群组选择器
1 、作用
选择器声明以逗号来隔开的选择器列表.其目的是为了声明一组选择器中的公共样式
2、语法
选择器1,选择器2,选择器3,…,{
}

				ex：
					设置页面上所有的p元素，span元素，id为d1元素，class为redColor的元素的文本颜色 为 红色
					p,span,#d1,.redColor{
						color:red;
					}
					等同于
					p{color:red;}
					span{color:red;}
					#d1{color:red;}
					.redColor{color:red;}

6、后代选择器
1 、作用
用于匹配某元素的后代元素时使用
2、语法
选择器1 选择器2{

}
7、子代选择器
1、作用
用于匹配某元素的子代元素
2、语法
选择器1>选择器2{
}
8、伪类选择器
1、作用
为了匹配元素不同的状态的
2、语法
:伪类选择器{}
3、分类
1、链接伪类
:link :匹配 超链接 未被访问时的状态
:visited :匹配 超链接 被访问过的状态
2、动态伪类
:hover :匹配鼠标悬停在 html 元素时的状态
:active : 匹配 html元素 被激活时的状态
:focus : 匹配html元素获取焦点时的状态(文本框与密码框)

				3、目标伪类
				4、元素状态伪类
				5、结构伪类
				6、否定伪类