The `<small>` tag in HTML is used to define smaller text than the surrounding text. It is typically used to indicate small print or legal disclaimers. In this tutorial, we will explore the usage of the `<small>` tag and provide examples to help you understand how to use it effectively.
Syntax:
The `<small>` tag is a non-semantic inline element and is written using the following syntax:
<small>text</small>
The text within the `<small>` tag will be displayed in a smaller font size than the surrounding text.
Example Usage:
Let’s consider a scenario where you have a website with a legal disclaimer at the bottom of the page. You can use the `<small>` tag to make the disclaimer text appear smaller than the rest of the content on the page.
<footer>
<p>This website is for informational purposes only. By using this site, you agree to the terms and conditions set forth in our <a href=”#”>Privacy Policy</a>.</p>
<small>This website does not provide medical advice, diagnosis, or treatment. Always seek the advice of a qualified healthcare provider with any questions you may have regarding a medical condition.</small>
</footer>
In the example above, the `<small>` tag is used to display a legal disclaimer in a smaller font size than the rest of the text on the page.
Styling the `<small>` Tag:
You can use CSS to style the `<small>` tag as per your website’s design requirements. For example, you can set the font size, font family, and color of the text within the `<small>` tag using CSS.
small {
font-size: 0.8em;
font-family: Arial, sans-serif;
color: #999;
}
In the example above, the font size of the text within the `<small>` tag is set to 0.8em, the font family is set to Arial or any sans-serif font, and the color of the text is set to #999.
Conclusion:
The `<small>` tag is a useful HTML element that can be used to display small print or legal disclaimers on a web page. By using this tag, you can make sure that the text is displayed in a smaller font size than the surrounding text, making it easier to read and less distracting. Remember to use the tag only for its intended purpose and not to make the text smaller just for the sake of aesthetics.