HTML/CSSQuestion 12 of 14
Adding CSS to a page
Answer out loud or in your head first, then compare.
Answer
The three basic ways are an external stylesheet, a style block and the style attribute on an element.
HTML
<link rel="stylesheet" href="styles.css">
<style>.note { color: navy; }</style>
<p style="margin: 0">Text</p>In practice: an external file is good for sharing and caching. A style block can be handy for a small, self-contained page. I keep inline styles to justified cases.
To be precise: CSS Modules and CSS-in-JS organise or generate styles; in the end the browser still applies CSS.
Pitfall: the style attribute can't hold ordinary selectors or media queries.
How did it go? Be honest — “Not yet” puts the question on your review list.