Loading... 
Loading exercise code...

Exercise: Master HTML Headings

Objectives

In this exercise, you will:

  • Learn the difference between heading levels <h1> through <h6>
  • Understand heading hierarchy and SEO importance
  • Practice styling headings with CSS
  • Learn proper text alignment and decoration techniques

What You’ll Learn

Heading Tags:

  • <h1> - Page title (largest, most important)
  • <h2> - Section heading
  • <h3> - Subsection
  • … and so on through <h6> (smallest)

Styling Tips:

  • Use <style> tags in the <head> section for CSS
  • Apply colors using color property
  • Align text with text-align property
  • Make text bold with <strong> or font-weight

Challenges in This Exercise

  1. Fix the red heading - The fontColor attribute is deprecated. Use CSS color property instead.
  2. Proper text alignment - The <center> tag is deprecated. Use text-align: center in CSS instead.
  3. Responsive sizing - Make the paragraph responsive using modern CSS width properties.

Tips for Success

  • Always use CSS for styling, not HTML attributes
  • Use semantic HTML tags (<strong> instead of <b>)
  • Remember heading hierarchy is important for accessibility
  • Test your changes in the Preview tab to see results immediately

Next Steps

After completing this exercise:

  1. Try changing the heading colors
  2. Experiment with different font sizes
  3. Practice using CSS classes for styling multiple headings
  4. Move on to the Links exercise!