css选择器

       序号/  选择器          /                     例子              /            例子说明 

1. .class                                       .div1                           选择class="div1"的元素
2. #id                                            #div1                          选择id="div1"的元素
3. *                                                *                                  通配符，选择所有元素
4. element                                   p                                 选择所有p元素
5. element element                   div p                           选择div所有孩子中的p元素
6. element,element                   div,p                           选择div和p元素
7. element>element                  div>a                         选择div下面的第一级孩子中的a（不是所有的孩子元素都能使用>选择器）
8. element+element                  div+a                         选择div同级元素中紧邻此div下面的a（不是所有元素都能使用+选择器）
9. element~element                  div~a                         选择此div下面同级元素中所有的a
10. [attribute]                                  [title]                          选择所有有title属性的元素
11. [attribute=value]                      [type=button]           选择所有type属性值为button的元素
12. [attribute~=value]                    [class~=div1]          选择使用class属性值为div1的元素
13. [attribute|=value]                     [class|=nav]             选择class属性值以nav-开头的元素
14. [attribute^=value]                    [class^=nav]             选择class属性值以nav开头的元素（注意和上面的相比选择范围更大）
15. [attribute$=value]                    [class$=nav]           选择class属性值以nav结尾的元素
16. [attribute*=value]                    [class*=nav]             选择class属性值中包含nav字符串的元素
17. :link                                           a:link                          未被访问的链接
18. :visited                                      a:visited                    已被访问的链接
19. :active                                       a:active                      活动的链接，点击时显示的样式
20. :hover                                       a:hover                       鼠标经过链接时的样式
21. :focus                                       input:focus                选择获得焦点的元素
22. :first-letter                                p:first-letter                选择每个p的首字母
23. :first-line                                  p:first-line                  选择每个p的首行
24. :first-child                                p:first-child                p的父元素的第一个子元素如果是p则选中
25. :last-child                                p:last-child                p的父元素的最后一个子元素如果是p则选中 
26. :only-child                               p:only-child                p的父元素的子元素只有一个，且这个元素是p，则选中这个p
27. :before                                     div:before                   在div前插入
28. :after                                         div:after                      在div后插入
29. :lang                                         p:lang(en)                 选择lang属性值为en或者以en-开头的p
30. :first-of-type                            p:first-of-type             p的父元素的子元素中的第一个p（注意和上面first-child区分）
31. :last-of-type                            p:last-of-type             p的父元素的子元素中的最后一个p（注意和上面last-child区分）
32. :only-of-type                           p:only-of-type             p的父元素的子元素中的p只有一个，则选中这个p（注意和上面only-child区分）
33. :nth-child(n)                           p:nth-child(3)             选择p的父元素的第n个子元素，注意是p的父元素的所有子元素的第n个
34. :nth-last-child(n)                   p:nth-last-child(3)     选择所有p元素中的倒数第三个（可以任意改变括号能的数值，可以使用3n来指定倍数值）
35. :nth-of-type(n)                        p:nth-of-type(3)          选择是其父元素的子元素中所有p中第3个p的p（可以任意改变括号能的数值，可以使用3n来指定倍数值）
36. :nth-last-of-type(n)                p:nth-last-of-type(3)  选择是其父元素的子元素中所有p中倒数第3个p的p（可以任意改变括号能的数值，可以使用3n来指定倍数值）
37. :root                                         :root                              选取文档的根元素
38. :empty                                     p:empty                       选取没有子元素的p
39. :target                                     :target                           被定位到的元素
40. :enabled                                 input:enabled             启用的input（大多用于表单元素）
41. :disabled                                input:disabled            禁用的input（大多用于表单元素）
42. :checked                                input:checked             被选中的input
43. :not(selector)                        :not(p)                           选择不是p的元素
44. ::selection                              ::selection                   用户选取的部分，例如选取了某段文字（-moz-selection）

声明：所有文章仅为个人学习中的笔记总结，可能会出现错误，希望大家能相互学习