选择器会告诉浏览器网页上的那些元素需要设置什么样的样式。

然后选择器分为：

元素选择器：根据标签的名字来从页面中选取指定的元素。  标签名{}

类选择器：根据元素的class属性值选取元素  .className{}

ID选择器，根据元素的ID元素属性值选取元素。 id{}

并集选择器：可以同时使用多个选择器   选择器1，选择器2，选择器n

通用选择器：可以同时选中页面中的所有内容。*{}

后代选择器：后代选择器可以根据标签的关系，为处在 元素内部的代元素设置样式。祖先元素 后代元素 后代元素 { }

伪类和伪元素

顺序不可改变

•获取焦点–:focus

•指定元素前–:before

•指定元素后–:after

•选中的元素–::selection

段落首字母：first-letter

段落首行：first-line

属性选择器

作用：可以根据元素中的属性或属性值来选取指定元素

语法：

[属性名] 选取含有指定属性的元素

[属性名="属性值"] 选取含有指定属性值的元素

[属性名^="属性值"] 选取属性值以指定内容开头的元素

[属性名$="属性值"] 选取属性值以指定内容结尾的元素

[属性名*="属性值"] 选取属性值包含指定内容的元素

子元素选择器：可以给另一个元素的子元素设置样式。  父元素 >  子元素 {}

否定伪类：可以帮助我们选择不是其他东西的某样东西。  ：not(选择器){}

•继承是指应用在一个标签上的那些CSS样式会同时被应用到其内嵌标签上。

权重的计算 ，或者说是优先级的计算

餐厅练习题：

1-----plate 元素选择器

2-----bento 元素选择器

3-----#fancy ID选择器

4-----plate apple 后代元素选择器

5-----#fancy pickle 复合选择器

6-----.small 类选择器

7-----bento .small,plate .small并集选择器

8-----orange.small 后代元素选择器

9-----plate,bento 并集选择器

10---- * 通配选择器

11---- plate * 后代元素选择器 （plate中的所有元素）

12----plate + apple 兄弟元素选择器

13----bento~pickle 兄弟元素选择器（bento后面所有的pickle）

14----plate > apple 子元素选择器

15----orange:first-child 子元素选择器

16----:only-child 子元素选择器（只有一个子元素的）

17-----.small:last-child 子元素选择器

18-----plate:nth-child(3) 子元素选择器

19-----：nth-last-child（4）子元素选择器

20-----apple:first-of-type 子元素选择器

21-----plate:nth-of-type(even) 子元素选择器

22-----plate：nth-of-type（2n+3）子元素选择器

23-----apple：only-of-type 子元素选择器

24-----.small:last-of-type 子元素选择器

25-----bento:empty 子元素选择器（子元素为空）

26-----apple:not(.small) not选择器