For the More Curious: Specificity! When Selectors Collide…

You have already seen how you can override styles. You included the link for normalize.css before the one for styles.css, for example. This made the browser use normalize.css’s styles as a baseline, with your styles taking precedence over the baseline styles.

This is the first basic concept of how the browser chooses which styles to apply to the elements on the page, known to front-end developers as recency: As the browser processes CSS rules, they can override rules that were processed earlier. You can control the order in which the browser processes CSS by changing the order of the <link> tags.

This is simple enough when the rules have the same selector (for example, if ...

Get Front-End Web Development: The Big Nerd Ranch Guide now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.