Cyber Week

Save big!

All courses under $5 - for a limited time!

Code has been added to clipboard!

HTML Subscript: Using sub Tags

Reading time 1 min
Published Jun 29, 2017
Updated Sep 11, 2019

HTML Subscript: Main Tips

  • To make plain text into a subscript HTML element, you should use <sub> tags. Both starting and ending tags must be used.
  • HTML subscript has a lower baseline and occupies less height than usual text.
  • The <sub> tag does not have specific attributes, but supports global ones.

HTML Code for Subscript

By surrounding inline text with <sub> tags, you turn it into subscript in HTML:

Example
<p>This text contains <sub>subscript</sub> text.</p>

HTML subscript <sub> tag uses this default CSS styling:

Example
sub {
    vertical-align: sub;
    font-size: smaller;
}

Tip: you can learn more about these properties in CSS vertical-align and fonts tutorials.

Using Subscript in HTML

You should only use HTML subscript for typographical reasons, for example:

  • footnote numbers
  • variable subscripts
  • chemical formulas
Example
<!-- Here you can see footnote numbers: -->
<p>I do not like green eggs<sub>1</sub> and ham<sub>2</sub>!</p>
<!-- Here you can see variable subscripts: -->
<p>2<sub>3</sub>,  4<sub>5</sub>, x<sub>y</sub></p>
<!-- Here you can see chemical formulas: -->
<p>H<sub>2</sub>O, NaHCO<sub>3</sub>, C<sub>12</sub>H<sub>22</sub>O<sub>11</sub></p>

Tip: in other cases, use CSS styling properties.

Browser Support

Browser image
Chrome
All
Browser image
Edge
All
Browser image
Firefox
1+
Browser image
IE
All
Browser image
Opera
All
Browser image
Safari
All

Mobile Browser Support

Browser image
Chrome
All
Browser image
Firefox
4+
Browser image
Opera
All
Browser image
Safari
All