一、CSS常用选择器
前言：
页面中，所有的CSS代码，需要写入到<style></style>标签中。
style标签的type属性应该选择"text/css"，但是type属性可以省略。
CSS修改页面中的所有标签，必须借助选择器选中。
选择器中，可以写多对CSS属性，用{}包裹。每个属性名与属性值之间用:分隔，多对属性之间，必须用;分隔。
写法：
选择器{
属性1:属性值1;
}
(1)通用选择器：
1. 写法：*{ }
2.作用：选中页面中的所有标签
3.优先级：最低
(2)标签选择器：
1.写法：标签名{ }
2.作用：根据选择器名 称，选中页面中的所有html标签。
(3)类选择器：(class选择器):
1. 写法：.class名（注意：一定不能忘记前面的点.）
调用：在html标签中，使用class="class名"调用选择器。
2.优先级：class选择器>标签选择器
(4)ID选择器：
1. 写法：#ID名{ }
调用：在html标签中，使用id="id名"调用选择器。
2.优先级：id选择器大于class选择器
(5)交集选择器:
1. 写法：选择器1选择器2选择器3……{ }
多个选择器之间紧挨着，没有任何分隔；
2. 作用效果：一个标签要满足交集选择器，则必须满足交集选择器中出现的所有选择器；
(6)并集选择器
1. 写法：选择器1，选择器2，……选择器N{}。多个选择器之间用逗号分隔。
2. 生效规则：只要满足并集选择器中的一个，即可生效。
(7)后代选择器
1. 写法：选择器1选择器2……选择器N{}。选择器之间用空格分隔
2.生效规则：必须满足，后一个选择器，是前一个选择器的后代（子代、孙代、），才会生效。
(8)子代选择器
1.写法：选择器1>选择器2>……选择器N{}。选择器之间用>分隔
2.生效规则：必须满足，后一个选择器，是前一个选择器的直接子代才会生效。隔代，即中间包含其他标签，则不会生效。
(9)伪类选择器（后续讲解）
二、CSS导入方式和优先级
【选择器的注意事项】
1 .id选择器与class选择器的区别？
①写法不同：class选择器使用.声明，而ID选择器使用#声明。
②优先级不同：当作用于同一标签时，id选择器高于class选择器
③在同一HTML文件中，ID是唯一的，所以ID选择器只能作用于一个标签上，但是，class选择器可以作用于N个标签。
2.选择器的命名规则：
只能有：字母、数字、下划线、减号组成。开头不能是数字。
3.选择器的优先级排序：
①首先遵循近者优先原则。哪个选择器，作用于最里层标签，则哪个选择器生效。
②当作用于同一层标签时，优先级排序如下：
id选择器大于class选择器大于标签选择器大于通用选择器。
【选择器的优先级】
1.第一原则：
近者优先。作用于最里层的选择器生效。
2.当作用于同一层时：
每种选择器所占优先级，可以进行运算获得：
标签选择器占权重1
class选择器占权重10
id选择器占权重100
行级样式表style=""占权重1000
注意：只有交集、后代、子代选择器，才参与优先级的累加！！而，并集选择器相当于写了两个选择器，没有总优先级。
3.如果计算出的优先级权重完全相同，则后写的选择器生效。
【引入CSS的三种方式】
1、行级样式表：在HTML标签中，使用style=""的形式引用；
<div style="height:100px"></div>
优点：使用灵活，优先级权重最高。
缺点：不符合W3c关于内容和表现分离的要求。不利于样式复用。代码杂乱，不利于后期维护。
2、内部样式表：在head标签中，使用style标签包裹CSS代码。
特点：一定程度的实现了HTML与CSS的分离，但是分离不够彻底，没有办法多页面公用样式。
<head>
<style type="text/css">
<style/>
</head>
3、外部样式表：将CSS代码,全部写到一个CSS文件中，使用link标签，将html文件与css文件关联。
rel:选择stylesheet
type选择"text/css"，可以省略。
href选择CSS文件地址。
<link rel="stylesheet" type="text/css" href="css/01-css.css"/>
优点：彻底实现CSS与HTML的分离，符合W3C规范，有利于多页面复用统一样式。
[导入CSS文件的两种方式]
①在<head>标签中，使用link链接：
<link rel="stylesheet" type="text/css" href="css/01-css.css"/>
②在style标签中，使用@import导入；
@import url("css/01-css.css");
【两种导入方式的区别】
①link术语标准的HTML标签，而@import url不是标准的标签；
②link可以兼容所有低版本的浏览器，而@import url只在CSS2之后可用；
③link是将两个文件链接起来，起桥梁作用，而@import相当于将CSS文件复制到HTML文件中；
④link会在HTML文件边加载的过程当中，边加载CSS文件；@import会在HTML文件加载完之后，再导入CSS文件；
综上所述，我们使用link连接的方式加载CSS文件.