pseudoclassname

Pseudoclassname is a term sometimes used to refer to the textual identifier of a CSS pseudo-class within a selector. In standard CSS terminology, the name itself is called a pseudo-class name, such as hover, focus, active, or nth-child. The pseudoclassname is placed after a colon in a selector (for example, a:hover or li:nth-child(2)) and selects elements based on user interactions, states, or positions rather than their document structure alone.

In practice, pseudoclass names may be simple identifiers or functional forms that accept parameters. Simple examples include :hover, :focus, and :visited, while functional forms include :nth-child(2), :not(.hidden), and :dir(ltr). Multiple pseudoclass names can be combined on a single selector (e.g., button:focus-visible:hover) to refine when styles apply.

Pseudoclass names differ from pseudo-elements, which use a double colon notation and insert generated content before or after elements (for example, ::before or ::after). Pseudo-classes affect existing elements in the document flow based on state or position, whereas pseudo-elements create or style new content fragments.

Browser support for standard pseudoclass names is broad across modern engines, with progressive enhancement typical for interactive states. They are defined in the CSS Selectors specification and are a core part of styling in CSS Level 3 and newer.

Common examples illustrate practical use: a:hover for interactive links, a:visited for visited links, li:first-child for structural targeting, and input:focus for accessibility-focused styling. When using pseudoclassnames, it is advisable to keep selectors clear and avoid over-nesting.