1.标签选择器
p {
background-color:yellow;
color:white;
}
2.通配符选择器
* { color：red; }
设置当前页面中所有标签的颜色为红色
3.ID选择器（#）
4.类选择器（.）
5.复合选择器 h3.demo{} 需要同时满足既是标签h3又拥有demo类才能被选择到。
6.后代选择器 中间用空格分隔 后代不仅仅包括儿子，还包括子子孙孙
7.子代选择器
是让CSS选择器智能选择儿子辈的元素
h1 > strong {color:red;}
8.属性选择器
属性选择器就是根据html标签的属性进行过滤选择
常见的几种方式：
h1[id] {color: red; }
设置包含id属性的h1标签的字体为红色。
/*把拥有id和class属性的h1标题选出来然后设置字体大小为17px*/
h1[id][class] { font-size: 17px; }
input[type="text"] {background-color: purple; }
设置拥有type属性并且属性值是text的input标签的背景为紫色。
9.伪类选择器
:link
伪类将应用于未被访问过的链接。IE6不兼容，解决此问题，直接使用a标签。
:hover
伪类将应用于有鼠标指针悬停于其上的元素。在IE6只能应用于a连接，IE7+所有元素都兼容。
:active
伪类将应用于被激活的元素，如被点击未放开的链接、被按下未放开的按钮等。
:visited
伪类将应用于已经被访问过的链接
:focus
伪类将应用于拥有键盘输入焦点的元素。
顺序问题：LoVe FHAte原则。
10.伪元素选择器
伪元素是控制内容
:first-line 伪元素
:first-letter 伪元素
注释：以上两个伪元素只能用于块级元素
:first-child 伪元素，选择属于第一个子元素的元素。
例如：span:first-child{} /*选择属于第一个子元素的所有span标签。*/
:before与:after伪元素，可以设置元素之前后之后的 内容，并且配合content设置相关内容。比如： #demo:after,#demo:before{ content:"--";display:block;}