CSS选择器

CSS选择器

1. 标签选择器：
   根据标签名称选择一类元素

     <div></div>
     <span></span>

2. id选择器：
   通过id属性选择一个元素
   #value
3. 类选择器：
   class .value
4. 普遍选择器：
   *：所有
5. 后代选择器：
   >：选择当前元素的直接子元素
空格：选择当前元素的所有后代元素，包含孙代元素
6. 兄弟选择器：
   +：选择当前元素之后的一个兄弟
～：选择当前元素之后的所有兄弟元素
7. 属性选择器：
   根据元素的属性选择一类元素
   [id]:选择当前页面中具有id属性的元素
[class='one']:选择当前页面中具有class属性并且属性值为one的元素
[class~='one']:选择当前页面中具有class属性，并且属性值之一为one的元素
[class^='o']:选择当前页面中具有class属性。并且属性值以o开头
[class$='o']:选择当前页面中具有class属性，并且属性值以o结尾
[class*='o']:选择当前页面中具有class属性，并且属性值中包含o字符的
8. 多选择器：
   使用逗号隔开多个选择器
9. 组合选择器：
   将多个选择器组合到一起使用
div.one
10. 伪类选择器：
    :first-child
:last-child
:nth-child(number/odd/even)
:hover
:active
:link
:visited
11. 伪元素选择器:
    ::first-line
::seclection
::before content:'text'/url()
::after
12. 选择器优先级:
    特性值越大优先级越高，当特性值相同时，越靠下的优先级越高
基础值：
style属性：1000、
id：100
class/属性/伪类:10
元素/伪元素：1
!important:不计入特性值的计算