（1）标签选择器： body、div、p、ul等等
（2）通用选择器： *（用来选取所有元素）
（3）id选择器： #idName
（4）类选择器: .className
（5）后代选择器/包含选择器:（连接符为空格）
div p //指作为div元素后代的所有p元素，允许有隔代关系
（6）子元素选择器（连接符为 >）
div > p //仅指作为div元素子元素的p元素，仅有父子关系
（7）群组选择器（连接符为,）
div,p //几个元素样式属性一样时使用
（8）相邻兄弟选择器（连接符为 +）
div + p //指都作为div兄弟元素的p元素，两者有共同父元素，但是div不会受样式影响
（9）伪类选择器（向某些选择器添加特殊的效果）
伪元素的语法：
selector:default-element{property:value;}
CSS 类也可以与伪元素配合使用：
selector.class:default-element{property:value;}
:first-line{} /* 用于向文本首行设置特殊样式，只能用于块级元素 */
:first-letter{} /* 用于向文本的首字母设置特殊样式 */
:before{} /* 用于向元素前插入内容 */
:after{} /* 用于向元素后插入内容 */
:link{} /* 向未被访问的链接添加样式 */
:visited{} /* 向已访问的链接添加样式 */
:hover{} /* 当鼠标悬停在元素上方时，向元素添加样式 */
:active{} /* 向被激活的元素添加样式 */
:focus{} /* 向获取焦点后的元素添加样式 */
:first-child{} /* p:first-child选取的是p元素父元素的第一个子p元素，而不是此p元素的第一个子元素 */
:last-child{} /* 选取此父元素的最后一个子元素 */
:nth-child(n){} /* 选取此父元素的第n个子元素，索引从1开始，n为表达式时索引从0开始 */
:empty{} /* 选取没有任何内容的元素 */
:enabled{} /* 选取处于可用状态的元素，一般用于input、select和textarea */
:disabled{} /* 选取处于禁用状态的元素，一般用于input、select和textarea */
:checked{} /* 选取处于被选中状态的元素，一般用于input和textarea */
（10）属性选择器（对带有指定属性的HTML元素设置样式）
[attr] /* 选取带有指定属性的元素 */
[attr = value] /* 选取带有指定属性和值的元素 */
[attr ~= 'value'] /* 选取属性值中包含指定value的元素,value为单独存在的单词，不能包含在其他单词中 */
[attr *= 'value'] /* 选取属性值中包含指定词汇的元素 */
[attr |= 'value'] /* 选取带有以指定值开头，或者等于该值的元素 */
[attr ^= 'value'] /* 选取属性值以value开头的所有元素 */
[attr $= 'value'] /* 选取属性值以value结尾的所有元素 */