Formatting Tags

Text Formatting Elements

Visual and semantic styling of inline text.

HTML has formatting elements designed to display text with special visual or semantic meaning.

Formatting Elements

  • <strong>: Identifies text of strong importance (rendered bold).
  • <b>: Formats bold text (purely visual, no semantic value).
  • <em>: Emphasizes/stresses text (rendered italic).
  • <i>: Formats italic text (purely visual, no semantic value).
  • <u>: Underlines text.
  • <mark>: Highlights/marks text.
  • <small>: Displays smaller text size.
  • <sup>: Superscript text.
  • <sub>: Subscript text.
  • <code>: Formats inline code fragments.
  • <pre>: Preformatted text. Keeps layout whitespaces and linebreaks exactly as written in source code.

Formatting Example

html
<strong>Important</strong>

<em>Italic</em>

<mark>Highlighted</mark>

<code>console.log()</code>

<pre>
Hello
World
</pre>

Interview questions

Sign in to save

What is the difference between <strong> and <b>, and between <em> and <i>?

<strong> and <em> are semantic tags. They carry architectural meaning telling screen readers and SEO spiders that the content has special emphasis. <b> and <i> are stylistic tags that only apply bold or italic styles visually without conveying semantic weight.

Practice

Format the chemical formula for water (H2O) and a math term like x-squared (x²).

Hint: Use the <sub> tag for the '2' in water, and the <sup> tag for the '2' in x-squared.