CSS: Pseudo Class

By Xah Lee. Date: . Last updated: .

What is Pseudo-Class

Pseudo-Class means the state of an element, such as in focus, mouse hovering it, clicked, checkbox checked, empty content, language spec, first child, etc.

it is like having a HTML: Class Attribute but not exactly.

CSS: Pseudo-Class Selectors lets you select them based on the element's state.

Pseudo-Class Syntax

tagName:pseudoClassName

They match HTML or XML elements in some particular way, by criterion of nesting structure relationship with other elements, or user interface state, or other misc criterion.

Example of Pseudo-Class

/* pseudo-class CSS selectors, to color links */
a:link {
 text-decoration: none;
}

a:visited {
 text-decoration: none;
}

a:hover {
 background-color: pink;
}

Complete List of Pseudo-Class

CSS, pseudo-element and pseudo-class