The Basics #
There are four really fundamental CSS selectors which are the most common that you will see. Those are class, star, element and ID selection.
Element selection
Class selection
ID selection
Star selection
Combinations
Siblings and Direct Children #
When we want to get a bit more specific, we can select elements based on their position within the HTML.
Sibling Selectors
Child selection
Selection by Attributes #
Although class and ID selection are built in, you can also select any element by any attribute using attribute selection. This uses the square bracket notation, i.e. p[attr]. Note, that you can still use class and id in attribute selection, i.e. p[class].
Select if it has an attribute
Select if attribute equals or partially something
State Selection #
CSS also allows you to select items based on the state they are currently in. For example, an item can be hovered over, so it is said to be in the hover state.
Order Selectors #
CSS also allows you to select items based on the order they appear in.
Children
Of Type Selectors
