Complete CSS Selector List

CSS Selector Reference

This complete CSS selector list organizes selectors by type, making it easier to find the selectors used to target HTML elements by element name, class, ID, attributes, relationships, and other matching conditions. Use the search box to find a selector by name or description, or switch to the alphabetical view when you already know the selector you are looking for.

Each selector links to its complete reference page with syntax, examples, browser support, specificity information, related selectors, and other useful information. Pseudo-classes and pseudo-elements are covered separately in their own CSS reference sections.

Search CSS Selectors

Enter a selector name, syntax, or a word describing what the selector does. The list will automatically display matching selectors.

Basic Selectors

Basic selectors target elements by element type, class, ID, or universally across element types.

elementSelects elements by their HTML element name.

.classSelects elements whose class attribute contains the specified class name.

#idSelects an element whose ID matches the specified value.

*Selects elements of any type.

Attribute Selectors

Attribute selectors target elements according to the presence or value of an HTML attribute.

[attr]Selects elements that contain the specified attribute.

[attr="value"]Selects elements whose attribute value exactly matches the specified value.

[attr~="value"]Selects elements whose attribute contains the specified word in a whitespace-separated list.

[attr|="value"]Selects an exact attribute value or a value beginning with it followed by a hyphen.

[attr^="value"]Selects elements whose attribute value begins with the specified value.

[attr$="value"]Selects elements whose attribute value ends with the specified value.

[attr*="value"]Selects elements whose attribute value contains the specified sequence of characters.

Selector Lists

Selector lists group multiple selectors so the same CSS declarations can be applied to each matching selector.

A, BGroups multiple selectors in a comma-separated list.

Combinators

Combinators connect selectors and target elements according to their relationship with other elements.

A BSelects matching descendants contained anywhere within another matching element.

A > BSelects matching elements that are direct children of another matching element.

A + BSelects a matching sibling immediately following another matching element.

A ~ BSelects matching siblings that follow another matching element.

A || BSelects matching elements associated with a matching column.

Namespace Selectors

Namespace selectors limit type and universal selectors to elements associated with a particular namespace.

ns|elementSelects elements with a specified element name in the specified namespace.

ns|*Selects all elements within the specified namespace.

Nesting Selector

The nesting selector represents the parent rule when writing nested CSS rules.

&Represents the parent selector within a nested CSS rule.