W3docs

HTML <ins> Tag

The <ins> tag defines a part of the text which has been inserted into the document. Tag description, attributes and examples.

The <ins> tag is used to define a part of the text which has been inserted into the document. In the browser, tag content is displayed as an underlined text, although this can be changed with the CSS text-decoration property.

The <ins> tag is usually used with the <del> tag, which contains the deleted part of the text. The content of this element is displayed as crossed out text.

Modern screen readers typically announce inserted text automatically. For better accessibility, you can also use the aria-label attribute to provide additional context if needed.

Syntax

The <ins> tag comes in pairs. The content is written between the opening (<ins>) and closing (</ins>) tags.

Example of the HTML <ins> tag:

HTML <ins> Tag

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
  </head>
  <body>
    <p>She likes <del datetime="2023-01-01">violets</del> <ins datetime="2023-10-01">snowdrops</ins>.</p>
  </body>
</html>

Result

ins tag example

Example of the HTML <ins> tag with the CSS properties:

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
    <style>
      ins {
        font-size: 16px;
        font-weight: bold;
        color: red;
      }
      ins::before {
        content: " - ";
      }
    </style>
  </head>
  <body>
    <p>
      <q>You only live once, but if you do it right, once is enough.</q>
      <ins>Mae West</ins>
    </p>
  </body>
</html>

Attributes

AttributeValueDescription
citeURLIndicates the URL of the document that explains the reason for the insertion.
datetimeYYYY-MM-DDThh:mm:ssTZDDefines the date and time of the insertion.

The <ins> tag also supports the Global Attributes and the Event Attributes.

Practice

Practice

What does the HTML <ins> tag represent?