Index by Christopher Schmitt

Safari, the world’s most comprehensive technology and business learning platform.

Find the exact information you need to solve a problem on the fly, or go deeper to master the technologies and skills you need to succeed

Start Free Trial

No credit card required

O'Reilly logo

Appendix C. CSS 2.1 Selectors, Pseudo-Classes, and Pseudo-Elements

This appendix contains three reference tables that can help you learn how to apply styles to the correct elements.

Table C-1 contains the CSS 2.1 selectors. Selectors help tell the browser where to apply the CSS declarations.

Note

In the “Generic pattern” column of Table C-1, the values C, R, and S take the place of type selectors.

Table C-2 contains a list of pseudo-classes. A pseudo-class is a device by which a browser applies an invisible class on its own. For example, through the pseudo-class we are able to define properties for various visited, active, and hover states of the ubiquitous link.

Table C-3 contains a list of pseudo-elements. Similar in nature to a pseudo-class, a pseudo-element places invisible tags around content in a web page and then applies styles to that element. Since the structure is more like a typical element than a class, these elements are called pseudo-elements.

Table C-1. CSS 2.1 selectors

Selector

Generic pattern

Description

Sample

Universal

*

Matches with any element

* { text-decoration: none; }

Type

C

Matches any element; in this example, all h2 elements

h2 { font-weight: normal; }

Descendant

C R S

Matches any S element that is a descendant of element R, which is a descendant of element C

div#content p em { background-color: yellow; }

Child

C > S

Selects any S element that is a child of a C element

li > ul { list-style-type: circle;}

Adjacent sibling ...

Find the exact information you need to solve a problem on the fly, or go deeper to master the technologies and skills you need to succeed

Start Free Trial

No credit card required