就业培训     下载中心     Wiki     联络
登录   注册
  1. 首页
  2. CSS
  3. Pseudo-classes

在此页

A CSS pseudo-class is a keyword added to a selector that specifies a special state of the selected element(s). 例如， :hover can be used to change a button's color when the user's pointer hovers over it. 

/* Any button over which the user's pointer is hovering */
button:hover {
  color: blue;
}

Pseudo-classes let you apply a style to an element not only in relation to the content of the document tree, but also in relation to external factors like the history of the navigator ( :visited , for example), the status of its content (like :checked on certain form elements), or the position of the mouse (like :hover , which lets you know if the mouse is over an element or not).

注意： In contrast to pseudo-classes, pseudo-elements can be used to style a specific part of an element.

句法 

selector:pseudo-class {
  property: value;
}

Like regular classes, you can chain together as many pseudo-classes as you want in a selector.

索引

Pseudo-classes defined by a set of CSS specifications include the following:

A B C D E F H I L N O P R S T U V W

规范

规范 状态 注释
全屏 API 实时标准 Defined :fullscreen .
HTML 实时标准 实时标准 Defines when particular selectors match HTML elements.
Selectors Level 4 工作草案 Defined :any-link , :blank , :local-link , :scope , :drop , :current , :past , :future , :placeholder-shown , :user-invalid , :nth-col() , :nth-last-col() , :is() and :where() .
Changed :empty to behave like :-moz-only-whitespace .
No significant change for other pseudo-classes defined in Selectors Level 3 and HTML5 (though semantic meaning not taken over).
HTML5 推荐 Copies the relevant section from the canonical (WHATWG) HTML spec.
CSS Basic User Interface Module Level 3 推荐 Defined :default , :valid , :invalid , :in-range , :out-of-range , :required , :optional , :read-only and :read-write , but without the associated semantic meaning.
Selectors Level 3 推荐 Defined :target , :root , :nth-child() , :nth-last-of-child() , :nth-of-type() , :nth-last-of-type() , :last-child , :first-of-type , :last-of-type , :only-child , :only-of-type , :empty and :not() .
Defined the syntax of :enabled , :disabled , :checked ，和 :indeterminate , but without the associated semantic meaning.
No significant change for pseudo-classes defined in CSS Level 2 (Revision 1) .
CSS Level 2 (Revision 1) 推荐 Defined :lang() , :first-child , :hover ，和 :focus .
No significant change for pseudo-classes defined in CSS Level 1 .
CSS Level 1 推荐 Defined :link , :visited and :active , but without the associated semantic meaning.

另请参阅

元数据

  • 最后修改：
  1. CSS
  2. CSS 参考
  3. CSS Selectors
  4. 指南
    1. Using the :target pseudo-class in selectors
  5. 特性
    1. 选择器列表
  6. Basic Selectors
    1. Type selectors
    2. Class selectors
    3. ID selectors
    4. Universal selectors
    5. Attribute selectors
  7. 组合器
    1. Adjacent sibling combinator
    2. General sibling combinator
    3. Child combinator
    4. Descendant combinator
    5. Column combinator
  8. Pseudo-classes
    1. :active
    2. :any-link
    3. :checked
    4. :blank
    5. :default
    6. :defined
    7. :dir()
    8. :disabled
    9. :empty
    10. :enabled
    11. :first
    12. :first-child
    13. :first-of-type
    14. :fullscreen
    15. :focus
    16. :focus-visible
    17. :focus-within
    18. :has()
    19. :host()
    20. :host-context()
    21. :hover
    22. :indeterminate
    23. :in-range
    24. :invalid
    25. :is() (:matches(), :any())
    26. :lang()
    27. :last-child
    28. :last-of-type
    29. :left
    30. :link
    31. :not()
    32. :nth-child()
    33. :nth-last-child()
    34. :nth-last-of-type()
    35. :nth-of-type()
    36. :only-child
    37. :only-of-type
    38. :optional
    39. :out-of-range
    40. :placeholder-shown
    41. :read-only
    42. :read-write
    43. :required
    44. :right
    45. :root
    46. :scope
    47. :target
    48. :valid
    49. :visited
    50. :where()
  9. Pseudo-elements
    1. ::-moz-progress-bar
    2. ::-moz-range-progress
    3. ::-moz-range-thumb
    4. ::-moz-range-track
    5. ::-webkit-progress-bar
    6. ::-webkit-progress-value
    7. ::-webkit-slider-runnable-track
    8. ::-webkit-slider-thumb
    9. ::after (:after)
    10. ::backdrop
    11. ::before (:before)
    12. ::cue
    13. ::cue-region
    14. ::first-letter (:first-letter)
    15. ::first-line (:first-line)
    16. ::grammar-error
    17. ::marker
    18. ::part()
    19. ::placeholder
    20. ::selection
    21. ::slotted()
    22. ::spelling-error