pseudoclass

Pseudoclass, or pseudo-class, is a concept in CSS describing a keyword added to a selector to target elements in a specific state or position. Pseudo-classes describe conditions that are not represented by a separate element or attribute in the document tree but can be inferred from user interaction or structural relationships.

Common examples include :hover to style an element when the user points with a pointing device; :focus for keyboard focus; :active during activation; :visited and :link for link states. Structural pseudo-classes such as :first-child, :last-child, :nth-child(n) enable styling based on an element's position among siblings, while :nth-of-type(n) targets elements by type within a container. Others like :enabled, :disabled, :required, :valid, and :invalid reflect form element states, and :empty selects elements with no children.

Pseudo-classes differ from pseudo-elements (which create or style content generated by elements, such as ::before and ::after). They are part of the CSS Selectors specification, with evolving features in Selectors Level 3 and Level 4. Some pseudo-classes require arguments, as in :nth-child(2n+1) or :nth-last-child(n), while most others are invoked by a simple name after a single colon.

Browser support is extensive for standard pseudo-classes; newer ones like :focus-visible and some of the structural selectors have grown broader support in modern engines. Developers use pseudo-classes to respond to user input, provide accessibility cues, or implement dynamic styling without JavaScript.

See also: CSS selectors, pseudo-elements.