Basic Selectors
Selectors are listed in order of specificity, from the most general to the most specific. More specific selectors will override styles of more general selectors.
| Selector | Description | Syntax |
|---|---|---|
| Universal | Affects all elements on the page | * |
| Type | Affects all HTML elements of the selected name | type |
| Class | Affects all elements with the selected class | .class |
| ID | Affects the element with the selected ID | #ID |
Grouping & Combinators
These operators can be used to create hierarchical relationships between elements.
| Name | Description | Syntax |
|---|---|---|
| List | Selects all elements in list | X, Y |
| Descendant | Selects all Y within instances of X | X Y |
| Chain | Selects all elements that are both class X and class Y | .X.Y |
| Child | Selects all elements Y that have an immediate parent X | X > Y |
| Adjacent Sibling | Selects all Y that are immediately following instances of X | X + Y |
| General Sibling | Selects all Y that are following insances of X | X ~ Y |