HTML <del> Tag

The <del> tag specifies a part of the text that was deleted from the document. Browsers display this text as a strikethrough. To indicate a new version of the text, we use the <ins> tag, the content of which is displayed in the browser as underlined.

For displaying the text as underlined, you can use the CSS text-decoration property with the "line-through" value.

Most screen reading technology doesn’t announce the existence of the <del> tag in the default configuration. If you want to announce it, use the CSS content property with the ::after and ::before pseudo-elements.

Syntax

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

Example of the HTML <del> tag:

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
  </head>
  <body>
    <p>My favorite color is <del style="color:#8ebf42;">green</del> <ins style="color:#1c87c9;"> blue</ins>!</p>
  </body>
</html>

Result

Example of the HTML <del> tag with the "cite" attribute:

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
  </head>
  <body>
    <p>The <del cite="https://www.w3docs.com/learn-html/html-b-tag.html" style="color:#ff0000">b</del> <ins cite="https://www.w3docs.com/learn-html/html-strong-tag.html" style="color:#c10ccc;">strong</ins> tag being a logical tag is used to emphasize the importance of the text.</p>
  </body>
</html>

Attributes

Attribute Value Description
cite URL Specifies the URL of the document, which explains why the text was edited or deleted.
datetime YYYY-MM-DDThh:mm:ssTZD Defines date and time of the deleted text.

The <del> tag also uses the Global Attributes and the Event Attributes.


Browser support



Do you find this helpful?

Related articles