You've learned to select HTML elements with CSS. Now let's make text look amazing! Text styling is crucial for readability and creating a visual hierarchy on your page.
Engagement Message
Which text feature grabs your attention first when you load a page: the color, size, or font style?
The color property controls text color. You can use predefined color names like red, blue, or green, or you can use more specific hex codes like #FF0000 for red.
Example: p { color: navy; } makes all paragraphs a dark blue color.
Engagement Message
What's one advantage of using hex codes over color names like "red"?
The font-family property changes the typeface. It's best practice to provide a "font stack" with fallbacks, in case the user's browser doesn't have the first font.
For example:
body { font-family: Arial, Helvetica, sans-serif; }
The browser will try Arial first, then Helvetica, then any generic sans-serif font.
Engagement Message
Why are backup fonts important?
The font-size property controls how big or small text appears. You can use pixels () for a fixed size, or relative units like or that scale.
