Advanced CSS Selectors
A Guide to Selecting the Unselectable
Are you tired of selecting the wrong elements? Do you struggle with specificity? Do you dream of being the master of the CSS selector universe?
We'll cover the basics, the advanced, the obscure, and the completely useless.
Selector Types
- Element Selectors: Selecting the element, itself.
- Class Selectors: Selecting by class name, or so you thought.
- ID Selectors: Selecting by ID, the most precise, yet least used.
- Pseudo-Class Selectors: Selecting by class attribute, the pseudo way.
- Attribute Selectors: Selecting by attribute value, the attribute way.
- Universal Selectors: Selecting all the elements, the universal selector.
Selector Combinations
- Descendant Selectors: Selecting by descendant, the family tree.
- Child Selectors: Selecting the children, the family business.
- Adjacent Sibling Selectors: Selecting the sibling, the family friend.
- General Sibling Selectors: Selecting the siblings, the family reunion.
Advanced Selectors
- CSS Grid Selectors: Selecting by grid area, the grid guru.
- CSS Flexbox Selectors: Selecting by flex container, the flex master.
- CSS Position Selectors: Selecting by position, the positioning pro.
- CSS Layout Selectors: Selecting by layout, the layout king.
And that's not all, folks!