元素选择器可以根据标签的名字从页面中选取指定的元素。
语法： 标签名{ }
类选择器，可以根据元素的class属性值选取元素
语法： classNAME { }
ID选择器，可以根据元素id属性值选取元素
语法： #id { }
复合选择器（交集选择器）
符合选择器，可以同时使用多个选择器，这样可以选择同时满足多个选择的元素。
语法： -选择器1，选择器2 { }
群组选择器（并集选择器）
群组选择器，可以同时使用多个选择器，多个选择器将被同时制定的样式。
语法：选择器1，选择器2，选择器3 { }
通用选择器
通用选择器，可以同时选中页面的所有元素
语法： *{ }
HTML族谱
标签之间的关系
祖先元素
-直接或间接包含后代元素的元素。
后代元素
-直接或间接被祖先元素包含的元素。
父元素
-直接包含子元素的元素。
子元素
-直接被父元素包含的元素。
兄弟元素
-拥有相同父元素的元素。
后代选择器
后代选择器可以根据标签的关系，为处在元素内部的代元素设置样式。
语法：祖先元素 后代元素 后代元素{ }
伪类和伪元素
有时候，你需要选择本身没有标签，但是仍然易于识别的网页部位，比如段落首行或鼠标滑过的链接。CSS为他们提供一些选择器：伪类和伪元素
给链接定义样式
-a：link 正常链接
-a：visited 访问过的链接（只能定义字体颜色）
-a：hover 鼠标滑过的链接
-a：active 正在点击的链接
获取焦点 -：focous
指定元素后 -：before
指定元素后 -：after
选中的元素 -：：selection
属性选择器
属性选择器可以有特殊属性的标签。
语法：
子元素选择器
子元素选择器可以给另外一个元素的子元素设置样式
语法：父元素 > 子元素{ }
其他子元素选择器
：first-child 选择第一个子标签
：last-child 选择最后一个子标签
：nth-child 选择指定位置的子元素
以下三种选择指定类型的子元素
：first-if-type / ：last-of-type / ：nth-of-type
兄弟选择器
除了根据祖先父类关系，还可以根据兄弟关系查找元素。
语法：-查找后边一个兄弟元素
兄弟元素 + 兄弟元素 { }
查找后面所有的兄弟元素
兄弟元素 ~ 兄弟元素 { }
否定伪类
否定伪类可以帮助我们选择不是其他东西的某件东西
语法： ：not（选择器）{ }
继承 在CSS中祖先元素的样式同样会被子元素继承
不同的选择器有不同的权重值：
内联样式：权重是 1000
id选择器：权重是 100
类、属性、伪类选择器：权重是 10
元素选择器：权重是 1
通配符：权重是 0
继承的样式没有优先级
！important；优先级最高 在开发代码时尽量不要使用
第一题：plate 元素选择器
第二题：bento 元素选择器
第三题：#fancy ID选择器
第四题：plate apple 后代选择器
第五题：#fancy pickle 复合选择器
第六题：.small 类选择器
第七题：bento .small,plate .small 并集选择器
第八题：bento orange.small 后代元素选择器
第九题：plate,bento 并集选择器
第十题：* 通配选择器
第十一题：plate * 后代元素选择器
第十二题: plate +apple 兄弟元素选择器
第十三题：bento~pickle 兄弟元素选择器
第十四题： plate>apple 子元素选择器
第十五题： orange:first-child 子元素选择器
第十六题： :only-child 子元素选择器
第十七题： .small:last-child 子元素选择器
第十八题： plate:nth-child(3) 子元素选择器
第十九题： :nth-last-child(4) 子元素选择器
第二十题： apple:first-of-type 子元素选择器
第二十一题： plate:nth-of-type(even) 子元素选择器
第二十二题：plate: nth-of-type(2n+3) 子元素选择器
第二十三题：apple: only-of-type 子元素选择器
第二十四题： .small:nth-child(even) 子元素选择器
第二十五题：bento:empty 子元素选择器
第二十六题：apple:not(.small)not 选择器
