1. Text and Fonts in CSS

2. Customizing fonts In CSS, fonts are divided into “font families” Only certain fonts are commonly installed on most computers Therefore you must be careful in your font choices

3. Font Size Font size has a big impact on design and readability of Web pages There are several ways to specify font sizes with CSS The size of fonts can be controlled with the font-size property

4. Font Color, Weight and Style You can change your text color with the color property You can give fonts extra weight when needed using the font-weight property You can add decoration such as overlines, underlines and line-throughs

5. Font Families Each font family contains a set of fonts that share common characteristics There are five font families:  Sans-serif  Serif  Monospace  Cursive  Fantasy

6. Sans-Serif Family Verdana Arial Black Trebuchet MS Arial Tahoma

7. Serif Family Times New Roman Georgia Baskerville Bookman Old Style

8. Monospace Family Courier New Letter Gothic

9. Cursive Family Comic Sans Freestyle Script Bradley Hand

10. Fantasy Family Impact Copperplate gothic

11. Summary Serif fonts have an elegant, traditional look Sans serif fonts have a very clean, readable look Monospace fonts feel like they were typed on a typewriter Cursive and fantasy fonts have a playful or stylized feel

12. Specifying Font Families in CSS You can specify more than one font using the font-family property Type the font name, separated by commas  Body { font-family: Verdana, Geneva, Arial, sans-serif; }

13. How Font-Family Specifications Work Body { font-family: Verdana, Geneva, Arial, sans-serif; } The browser will first check to see if Verdana is available on the computer If Verdana is not available, the browser will look for Geneva. If Geneva is not available, the browser will look for Arial. Finally, if none of the specific fonts can be found, the browser will use whatever is considered the default sans-serif font.

14. Adjusting Font Sizes You can specify your font size in pixels  font=size: 14px; You can specify your font size in percentages  font-size: 150% You can specify your font size using “em” which is another relative unit of measure  font-size: 1.2em;