别名:标签选择器、标记选择器、标记选择器 特点：通过元素名称作为选择器名称
作用：修改某一元素的默认样式 body{} h1{} h2{}
2、类选择器(类样式) 特点：通过元素的 class 属性来进行引用 作用：定义某一组标签的统一样式 语法：.className{color:red;bakcground:yellow;} 注意：className不能以数字开头 引用：<div class="className"></div> <h3 class="className"></h3> 注意：在一个class 中可以引用多个 类样式,多个类样式用 空格 隔开
例如 <div class=“myDiv firstDiv”> 我是div</div>
3、分类选择器 由类选择器衍生出来的新选择器 将类选择器 与 元素选择器 结合使用 目的：为了更精准的定位的页面的元素 语法：元素选择器.类选择器{}
例如： p.content{}
4、通用选择器 作用：适配页面上所用的元素，改变他们的样式 语法：*{} 5、id选择器(id样式) 作用：通过页面元素的id值来进行选择器的引用,非常方便的定位到页面上的一个元素。精确定位。 语法：#id{} eg : #top{background-color:red;} <div id="top"></div> id的作用： 1、定义元素在页面中的唯一标识 2、引用样式表中的id样式
6、群组选择器 选择器声明是以 , 隔开的 选择器列表 作用：定义一组元素的样式 h3,p,.new,#test,div.newDiv,p.test{} 7、后代选择器 根据元素的嵌套关系来定义的样式 根据一个元素 去定位 它里面的其他元素 语法： selector1 selector2{} <div> <div> <p> <span></span> </p> </div> <span></span> </div>
8、子代选择器 要求选择器之间只能存在父子关系 语法: selector1>selector2 #test>.news{ 修改 id为test里面的 class为news的元素 } 后代选择器 和 子代选择器 目的是为了精确匹配范围 9、伪类选择器 匹配元素 不同状态时候的选择器 语法：selector1:伪类选择器 伪类选择器分类： 1、链接伪类 :link : 适用于尚未访问的链接，与:visited互斥 :visited : 适用于已访问过的超链接，与:link相斥 2、动态伪类 :hover : 适用于鼠标悬停在元素上面时候的状态 :active : 元素被激活的一瞬间的状态 :focus : 适用于元素获取焦点时的状态
注意： 需要注意的是在CSS的定义中，同一个元素的:hover必须位于:link、:visited之后才能生效， :active必须位于:hover之后才能生效