Introduction to HTML and CSS Coding

Font Families Text is the primary medium for conveying information on a webpage, making text styling one of CSS's most valuable features. The **`font-family`** property allows you to change the typeface of any text element. Serif vs. Sans-Serif Fonts fall into two broad categories: **Serif** — Letters have small decorative strokes ("feet") at the ends of their lines. Examples: Times New Roman, Georgia, Palatino. Serif fonts often appear more traditional or formal. **Sans-serif** — Letters have no feet, giving a cleaner, more modern look. Examples: Arial, Helvetica, Verdana. Sans-serif fonts are generally considered easier to read on screens. You can apply a general font category as the value: ```css p { font-family: sans-serif; } ``` This tells the browser to use its default sans-serif font (usually Arial or Helvetica). Specific Font Names For more precise control, use a specific font name: ```css p { font-family: Optima; } ``` Other common options include: Arial, Helvetica, Verdana, Trebuchet MS (sans-serif); Times New Roman, Georgia, Didot, Palatino (serif); and Courier (monospace). Font Backups If a user's browser doesn't have your chosen font installed, it will be ignored entirely. Always provide a **backup font** by adding a comma and a second font name: ```css p { font-family: Optima, sans-serif; } ``` Best practice: use the general font category (e.g., `serif`, `sans-serif`) as the backup,