CSS reference

Use this CSS reference to browse an alphabetical index of all the standard CSS properties, pseudo-classes, pseudo-elements, data types, and at-rules. You can also browse a list of all the CSS selectors organized by type and a list of key CSS concepts. Also included is a brief DOM-CSS / CSSOM reference.

Basic rule syntax

Style rule syntax

style-rule ::=
    selectors-list {
      properties-list
    }

... where :

selectors-list ::=
    selector[:pseudo-class] [::pseudo-element]
    [, selectors-list]

properties-list ::= 
    [property : value] [; properties-list]

See selector, pseudo-class, pseudo-element lists below. The syntax for each specified value depends on the data type defined for each specified property.

Style rule examples

strong {
  color: red;
}

div.menu-bar li:hover > ul {
  display: block;
}

For a beginner-level introduction to the syntax of CSS selectors, please see this tutorial. Be aware that any CSS syntax error in a rule definition invalidates the entire rule. Invalid rules are ignored by the browser. Note that CSS rule definitions are entirely (ASCII) text-based, whereas DOM-CSS / CSSOM (the rule management system) is object-based.

At-rule syntax

As the structure of at-rules varies widely, please see At-rule to find the syntax of the specific one you want.

Keyword index

Note: The property names in this index do not include the JavaScript names where they differ from the CSS standard names.

-ABCDEFGHIJKLMNOPQRSTUVWXZOthers

Selectors

The following are the various selectors, which allow styles to be conditional based on various features of elements within the DOM.

Basic selectors

Basic selectors are fundamental selectors; these are the most basic selectors that are frequently combined to create other, more complex selectors.

Grouping selectors

Selector list A, B
Specifies that both A and B elements are selected. This is a grouping method to select several matching elements.

Combinators

Combinators are selectors that establish a relationship between two or more simple selectors, such as "A is a child of B" or "A is adjacent to B."

Adjacent sibling combinator A + B
Specifies that the elements selected by both A and B have the same parent and that the element selected by B immediately follows the element selected by A horizontally.
General sibling combinator A ~ B
Specifies that the elements selected by both A and B share the same parent and that the element selected by A comes before—but not necessarily immediately before—the element selected by B.
Child combinator A > B
Specifies that the element selected by B is the direct child of the element selected by A.
Descendant combinator A B
Specifies that the element selected by B is a descendant of the element selected by A, but is not necessarily a direct child.
Column combinator A || B
Specifies that the element selected by B is located within the table column specified by A. Elements which span multiple columns are considered to be a member of all of those columns.

Pseudo

Pseudo classes :
Allow the selection of elements based on state information that is not contained in the document tree.
Pseudo elements ::
Represent entities that are not included in HTML.

See also: A complete list of selectors in the Selectors Level 3 specification.

Concepts

Syntax and semantics

Values

Layout

DOM-CSS / CSSOM

Major object types

Important methods

See also