Pseudo Classes in CSS
Pseudo Classes
The CSS pseudo-classes allow us to style elements, or parts of elements, that exist in the document tree without using JavaScript or any other scripts. A pseudo-class starts with a colon (":"). The most commonly used pseudo-classes are first-child and:last-child. The :first-child pseudo-class will only add style to the first selected element while :last-child will apply the style to the last selected element.
A list of pseudo-classes and pseudo-elements are:-
- :active Selector in CSS
- ::after Selector in CSS
- ::before Selector in CSS
- :checked Selector in CSS
- :default Selector in CSS
- :disabled Selector in CSS
- :empty Selector in CSS
- :enabled Selector in CSS
- :first-child Selector in CSS
- ::first-letter Selector in CSS
- ::first-line Selector in CSS
- :first-of-type Selector in CSS
- :focus Selector in CSS
- :fullscreen Selector in CSS
- :hover Selector in CSS
- :in-range Selector in CSS
- :indeterminate Selector in CSS
- :invalid Selector in CSS
- :lang Selector in CSS
- :last-child Selector in CSS
- :last-of-type Selector in CSS
- :link Selector in CSS
- ::marker Selector in CSS
- :not Selector in CSS
- :nth-child() Selector in CSS
- :nth-last-child() Selector in CSS
- :nth-last-of-type() Selector in CSS
- :nth-of-type() Selector in CSS
- :only-of-type Selector in CSS
- :only-child Selector in CSS
- :optional Selector in CSS
- :out-of-range Selector in CSS
- ::placeholder Selector in CSS
- :read-only Selector in CSS
- :read-write Selector in CSS
- :required Selector in CSS
- :root Selector in CSS
- ::selection Selector in CSS
- :target Selector in CSS
- :valid Selector in CSS
- :visited Selector in CSS