HTML <ins> Insert Tag
Tags: learnhtml, htmli
Published: 2021-05-10 08:41:59

---
title: HTML <ins> Insert Tag
published: true
date: 2021-02-25 04:55:33 UTC
tags: LearnHTML,HTMLI
canonical_url: https://sharepointanchor.com/learn-html/html-ins-insert-tag/
---

The term **<ins>** stand for **insert**. This tag is mainly used to specify the text which has been inserted into an HTML document. In HTML, the **<ins> insert tag** is sometimes used along with the **[<del>](https://sharepointanchor.com/learn-html/html-del-delete-tag/)** tag for a markup of deleted text.

By default, most of the browsers display the content between the <ins> tag as an **underlined text**. You can change this behavior by using the **CSS text-decoration** property.

This tag is found within the **<body>** tag. Usually, the screen reading technology **doesn’t announce the existence of the <ins> tag** in the default configuration. So you can announce it by using the **CSS content**  **property** with **::after** and **::before** pseudo-elements.

<svg aria-hidden="true" focusable="false" data-icon="clock" width="20" height="20" fill="none" stroke="currentColor" style="display:inline-block;vertical-align:-0.1em" role="img" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"></path></svg>Estimated reading time: 3 minutes

## Syntax:

The insert tag contains both the **starting <ins> tag** and the **ending </ins> tag**. The content is written between these tho tags.

```

<ins> Text </ins>

```

### HTML <ins> Tag Characteristics:
<style> th, td{ padding: 20px; } </style>

| HTML <ins> tag | Used to insert the new text. |
| Content categories | Phrasing content, flow content |
| Permitted content | Transparent |
| Tag omission | None, both opening and closing tags are mandatory. |
| Permitted parents | Any HTML element that accepts phrasing content. |
| Implicit ARIA role | No corresponding role |
| Permitted ARIA roles | Any |
| DOM interface | HTMLModElement |

## Sample of the HTML <ins> Tag:

```

<!DOCTYPE html>
<html>
  <head>
    <title>HTML <ins> Tag</title>
  </head>
  <body>
<h2>Example of the HTML <ins> Tag</h2>
    <p>My favorite color is <del>violet</del> <ins>green</ins>․</p>
  </body>
</html>

```

## Result:

![](https://sharepointanchor.com/wp-content/uploads/2021/02/result-44.png)<figcaption>Result</figcaption>

### Download Sample File:

[HTML-ins-tag](https://sharepointanchor.com/wp-content/uploads/2021/02/HTML-ins-tag.html)[Download](https://sharepointanchor.com/wp-content/uploads/2021/02/HTML-ins-tag.html)

## Use CSS property to style an HTML <ins> Tag:

You can use the **CSS text-decoration** properties to style the content within the **<ins>** tag.

### Sample of HTML <ins> tag with CSS properties:

```

<!DOCTYPE html>
<html>
  <head>
    <title>HTML <ins> Tag</title>
    <style>
      ins {
        font-size: 16px;
        font-weight: italic;
        color: #C40655;
      }
      ins::before {
        content: " ~ ";
        width: 1px;
      }
    </style>
  </head>
  <body>
<h2>Example of the HTML <ins> Tag</h2>
    <p>
      <q>Always remember that you are absolutely unique. Just like everyone else.</q>
      <ins>Margaret Mead</ins>
    </p>
  </body>
</html>

```

### Result:

![](https://sharepointanchor.com/wp-content/uploads/2021/02/res-1.png)<figcaption>Result</figcaption>

## Attributes:

The HTML **insert** tag supports both the **Global Attributes** and the **Event Attributes**.

<style> th, td{ padding: 20px; } </style>

| Attribute | value | Description |
| --- | --- | --- |
| cite | URL | It will specify the **URL of the document** , which explains why the text was edited or deleted. |
| datetime | YYYY-MM-DDThh:mm:ssTZD | Helps to define the **date and time of the deleted text**. |

## Browser Support:

![](https://sharepointanchor.com/wp-content/uploads/2021/02/Browser-Support-10.png)<figcaption>Browser Support</figcaption>

### Related Articles:

- **[HTML <embed> Embed Tag](https://sharepointanchor.com/learn-html/html-embed-tag/)**
- **[HTML <area> Area Tag](https://sharepointanchor.com/learn-html/html-area-tag/)**
- **[Basic HTML Definitions and Usages in the Real World](https://sharepointanchor.com/learn-html/basic-html-definitions-and-usages-in-real-world/)**
- **[HTML <html> Tag](https://sharepointanchor.com/learn-html/html-tag/)**
- **[HTML <figure> Figure Tag](https://sharepointanchor.com/learn-html/html-figure-tag/)**

The post [HTML <code><ins></code> Insert Tag](https://sharepointanchor.com/learn-html/html-ins-insert-tag/) appeared first on [Share Point Anchor](https://sharepointanchor.com).