HTML - <small> Tag



Introduction to <small> Tag

The HTML <small> tag is used to present copyright and legal text, as well as other side comments. By default, the <small> tag reduces the font size by one level(e.g., from medium to small, or from x-large to large) and displays the text inline.

When the <small> tag is used in a nested form, it adjusts the font size of the enclosed text relative to parent tag's font size.

Syntax

Following is the syntax of <small> tag −

<small>.....</small>

Example: Creating a <small> Element

In the following example, we create an HTML document using the <small> tag to represent text in a smaller font. THe HTML code includes a heading, a small text example, and a paragraph with a sentence in a smaller font size.

<!DOCTYPE html>
<html>
<body>
   <h2> tutorialspoint </h2>
   <small> Example of small tag! </small>
   <p> 
      This is the first sentence. 
      <small>This whole sentence is in small letters.</small>
   </p>
</body>
</html>

Example: Styling Element Using CSS

Considering the following example, we use the <small> tag and CSS properties to style the content. The HTML code styles a heading, a span, and a small tag, displaying a sentence in a smaller font.

<!DOCTYPE html>
<html>
<head>
   <style>
      h2 {
         color: green;
      }

      span {
         color: black;
      }

      small {
         font-style: italic;
         color: green;
         font-family: courier;
      }
   </style>
</head>
<body>
   <h2> tutorials <span>point</span>
   </h2>
   <small> Example of small tag! </small>
   <p> 
      This is the first sentence. 
      <small>This whole sentence is in small letters. </small>
   </p>
</body>
</html>

Example: Using <small> tag

Let's consider the following example, where we use the <small> tag in a nested form. This means the <small> tag will adjust its font size relative to its parent element. The HTML code styles paragraphs and creates a heading, with a nested small tag to adjust the font size relative to the parent element.

<!DOCTYPE html>
<html>
<head>
   <style>
      p {
         font-size: 18px;
      }
   </style>
</head>
<body>
   <h2>Welcome To tutorialspoint</h2>
   <p>
      A nested small tag changes its font size with 
      respect to the parent tag's font size!
   </p>
   <p> 
      This is the first sentence. 
      <small>This whole sentence is in small letters.</small>
   </p>
</body>
</html>

Example: Non-Nested Element

Following is the example, we use the small tag in a non-nested form. When the small tag is used separately, changing the font size of any other tag will not affect the font size of the small tag. The HTML code styles paragraphs, creates a heading, and displays a sentence with a smaller font size using the small tag.

<!DOCTYPE html>
<html>
<head>
   <style>
      p {
         font-size: 25px;
      }
   </style>
</head>
<body>
   <h2>Welcome To tutorialspoint</h2>
   <p>This is tutorialspoint </p>
   <small>Easy to learn! </small>
</body>
</html>
Tag Chrome Edge Firefox Safari Opera
small Yes Yes Yes Yes Yes
html_tags_reference.htm
Advertisements