What is HTML <sub> Tag?
The HTML sub tag is used to display text as subscript. Subscript text appears slightly below the normal text line and is often smaller in size. It is commonly used in chemical formulas, mathematical expressions, and scientific notations. The HTML sub tag helps make text more readable and properly formatted when such expressions are needed on a webpage.
Syntax of the HTML <sub> Tag
<sub>Subscript Text</sub>
The sub tag must start with <sub> and end with </sub>. Any text placed inside this tag will appear as subscript text below the baseline of the regular text.
Examples of HTML <sub> Tag
Example 1: Basic Subscript Text
<!DOCTYPE html>
<html lang="en">
<body>
<p>Water formula is H<sub>2</sub>O.</p>
</body>
</html>
Explanation:
In this example, the number "2" is displayed as subscript in the chemical formula for water. The HTML sub tag is used to position the text slightly lower than the rest of the line.
Example 2: SEO Optimized Example
<!DOCTYPE html>
<html lang="en">
<body>
<p>At Scholar247, we teach how to use HTML tags like CO<sub>2</sub> and E=mc<sub>2</sub> effectively in web design tutorials.</p>
</body>
</html>
Explanation:
This example uses the HTML sub tag to show chemical and mathematical notations within SEO-friendly content. It includes the keyword “HTML tags” naturally and demonstrates a real-world use case suitable for blog or educational websites like Scholar247.
Attributes of the HTML <sub> Tag
The HTML sub tag does not have any special attributes. It only contains plain text that is displayed as subscript. However, you can style the subscript text using CSS if needed, such as changing font size, color, or spacing.
Best Practices for HTML <sub> Tag
• Use the HTML sub tag only when subscript text is logically required, such as in formulas or scientific expressions.
• Do not use it for styling or positioning purposes; use CSS instead.
• Ensure the subscript text remains readable and does not overlap with other elements.
• Combine it with semantic HTML for better SEO and accessibility.
• Always close the tag properly to avoid formatting errors.
FAQs About HTML <sub> Tag
What is the purpose of the HTML sub tag?
The HTML sub tag is used to make text appear as subscript, typically for chemical formulas, equations, and references.
Can the HTML sub tag be styled with CSS?
Yes, you can apply CSS styles like font size, color, and spacing to the text within the sub tag.
Is the sub tag supported by all browsers?
Yes, all modern browsers fully support the HTML sub tag, ensuring consistent display across devices.
Can I nest the sub tag inside other tags?
Yes, the HTML sub tag can be used inside tags like p, span, or div, but it should be used only where subscript formatting is meaningful.
What is the difference between the sub and sup tag?
The sub tag is used for subscript text that appears below the baseline, while the sup tag is used for superscript text that appears above the baseline.