Home › HTML Masterclass › Headings and Text
Module 2: Maths & Science0 Level Beginner

9. Maths and Science Formulas (<sub> and <sup>)

Writing chemical and mathematical equations like H2O, CO2 and (A+B)2

Real-life analogy

Sub stands for Submarine (which goes below the water), and Sup stands for Superman (who flies up in the sky)!

Explanation

Both of these tags are essential for science and maths equations:

  • <sub> (Subscript): Shows a character half a level below the normal line and in a smaller size. Used in chemical formulas (for example water: H2O).
  • <sup> (Superscript): Shows a character half a level above the normal line as an exponent (power). Used in mathematical formulas or dates (for example 10th or X2).

Golden rules

  • Use for dates too, such as 26<sup>th</sup> January.

Common mistake

Mixing up the two names: remember 'Sub' goes below and 'Sup' goes above.

Example code

<!DOCTYPE html>
<html>
<body style="font-family: sans-serif; padding: 20px; line-height: 2;">
  <p>1. Sulphuric acid: <strong>H<sub>2</sub>SO<sub>4</sub></strong></p>
  <p>2. Formula of glucose: <strong>C<sub>6</sub>H<sub>12</sub>O<sub>6</sub></strong></p>
  <p>3. Algebra: <strong>(x + y)<sup>2</sup> = x<sup>2</sup> + 2xy + y<sup>2</sup></strong></p>
  <p>4. Today's date: <strong>15<sup>th</sup> August</strong></p>
</body>
</html>

Run & edit this in the live editor

Quick quiz

Which tag is used in maths to write an exponent (such as X to the power 2)?

  1. <sub>
  2. <sup>
  3. <power>
  4. <up>
Show answer

Answer: <sup>

<sup> (Superscript) shows text above the normal line as an exponent.

← All 38 lessons