Lesson 5

Text Block Styles

How do I add text with HTML?

A basic HTML webpage is made up of mostly just text, and sometimes images. That’s it. But usually you need to make some text appear more important than other types of text. How do you do that? With headings.

What are headings?

HTML uses 6 heading tags and 1 paragraph tag. They’re numbered 1-6, in order from most important to least important.

The most important heading on your page will probably use an <h1> tag. Other smaller headings might use <h2> or <h3>. You can use each one as many times as you want, and you don’t need to use every single heading on your page.

If your text is a full sentence or more, it should probably use a paragraph tag. 

<h1>
<h2>
<h3>
<h4>
<h5>
<h6>

What are paragraphs?

Most text on a webpage is in a paragraph. Paragraphs are for when you’re writing multiple sentences, while a heading is usually for bigger, more important pieces of information. Each time you start a new paragraph, you put it in a new <p> tag. This will add a gap between your paragraphs so they’re easier to read and organize.

Are you ready to learn?

Did you see the big news? No? It’s probably because the text on that poster isn’t organized. Will you help me fix it? We can use headings to help organize the text better.

  • Look at the existing code in the HTML box
  • Switch the heading tags around each piece of text
  • Keep testing tags until it matches the example

Hint: Start by figuring out which text is the biggest

 

Build with us!

HTML

CSS

JavaScript

Output