Your First Web Page

Bold, italic and line breaks in HTML & CSS

Topic 3 of 58 · 7 minFree lesson

Inside a paragraph, some words need to stand out. HTML has elements that mark words as important or stressed. There's also one for starting a new line without starting a new paragraph.

Important words

The  element marks words as important. Browsers show them in bold.

Example 1

Please do not feed the ducks.

Result

Stressed words

The  element, short for emphasis, marks a word you'd stress when you say it out loud. Browsers show it in italics.

Example 2

I said the blue door, not the red one.

Result

Elements inside elements

You can put elements inside other elements. This is called nesting. Close the inner element first, like closing a small box before the big box around it.

Example 3

 This is really very important.

Result

New lines with br

The   element starts a new line inside the same paragraph. It's handy for poems and addresses.

Example 4

 Roses are red, Violets are blue.

Result

  has no closing tag, because it has nothing inside it. An element like this is called an empty element.

Common mistakeUsing   to add space between paragraphs. Write each paragraph as its own  instead. The space between them is a matter of looks, which you'll set with CSS.

Example 5Don't do this

First paragraph. Second paragraph.

Result

TipYou may also see  and , which look the same as  and . Prefer  and : they say what the words mean, and screen readers can use that.

Try it yourself

Run the code in the editor and answer 8 practice questions on bold, italic and line breaks. It's free, you only need an account.

Practice this topic free I have an account