What are Pseudo Class Selectors in CSS?

A pseudo-class is used to define a special state of an element. The pseudo-class is a keyword added to the selector that specifies a special state of an element. They target the elements that cannot be targeted by combinators or simple selectors like id or class. They are used to select the elements based on their attributes, states and relative positions. For e.g., it can used to style an element when a user moves the mouse over it (hovering), style visited and unvisited links.

Syntax:

selector: pseudo-class { 
                        // css rule 

}

Pseudo-Classes are divided into five categories:

  • Linguistic Pseudo-Class
  • Location Pseudo-Class
  • User Action Pseudo-Class
  • Input Pseudo-Class
  • Tree Structural Pseudo-Class