The Ultimate Visual Guide to CSS Selectors
9 things to understand about writing clean CSS
At some point in your software engineering career, you’re going to encounter CSS.
On a technicality, it’s not actually a language — but the rules and how it’s structured can be as complicated. There are discussions and community initiatives around clean CSS as much as there is chatter about clean code.
When developers learn about CSS, we mostly learn how to use it in a working state. It’s like figuring out how to get an Angular or React app working without actually understanding JavaScript.
Why?
Because most of the time, it just works.
The basic tutorials don’t often go into how selectors work, and if they do, it’s often quickly brushed over despite being one of the foundational topics in CSS.
Or it’s done in a text-heavy way.
Without further ado, here is my contribution to your deeper understanding of CSS selectors.
The Quick Short on Selectors
Selectors are part of the CSS that tells the browser which part of the code to target. Basic selectors target HTML tags such as h1, p, and img tags. When you target the root tag, any styling you apply…
