Basic text formatting with HTML

Web Design with HTML & CSS

🕑 This lesson will take about 10 minutes

You can use a range of tags in HTML to format text on your webpage. This tutorial covers the following HTML formatting tags:

      • <strong> is used for bold (strong) text

      • <b> is also used for bold text

      • <em> is used for italicised (emphasised) text

      • <i> is also used for italicised text

      • <u> is used for underlined text

      • <del> is used for deleted text

      • <sub> is used for subscripted text

      • <sup> is used for superscripted text

      • <mark> is used for marked/highlighted text

      • <hr> is used for a horizontal rule (line) as seen below

The video below shows how to use these tags and also how to write comments inside your code that aren’t displayed on the webpage by the browser. Comments which are only visible in your code are written inside the <!– and –> tags.

Watch the video below and then scroll down to see the sample code and find out what each line of code does.

The code below shows how to use these different HTML formatting tags.

A comment is not actually displayed in the web browser. It is hidden and only visible inside your code. You can use comments to include the author of the code and date it was created. You can also use it to make notes on code that needs to be changed or what different bits of code are used for.

Note: Whilst comments are not visible with the content on the web page in the browser, a user can still use their browser to view the page source code and will be able to see comments there.

The difference between the <strong> and <b> tags

The <strong> tag is a part of HTML5. The <b> tag has been around for a very long time. The <em> tag is also a HTML5 tag, whereas the <i> tag has been around for a long time. In most browsers, it will appear that <strong> and <b> both do the same thing – they make text bold. And it may also appear that <em> and <i> do the same thing – they italicise text. However, there is a difference.

The <b> tag is a style. It describes how the text it surrounds should be displayed. The <strong> tag is indication of how something should be understood. It describes the text it surrounds. (eg. this text should be stronger than the rest of the text you’ve displayed).

Next lesson: Lists