<del>

Definition

The del element, also known as the "deleted text" element, is used to mark text that has been removed from a document. This text will appear with a horizontal line through it and is typically used to show the difference between the current version of the document and a previous version.

This element can be used in conjunction with the ins element, which is used to mark text that has been added to the document. The del element is useful for highlighting changes made to a document and can help to improve the readability and clarity of the content.

Examples

<p>I bought a new <del>car</del> bike today.</p>

In this example, the del element is used to strike through the word "car" to indicate that it has been deleted from the sentence. The text within the del element will typically be displayed with a horizontal line through it to indicate that it is no longer relevant.

Attributes

AttributeDescriptionDeprecated
citeContains a URL that specifies the reason why the text was deletedNo
datetimeContains a date-time value that specifies the time when the text was deletedNo

Best Practices

  • The <del> element should be used to represent deleted or struck-through text.
  • Use the <del> element in conjunction with the <ins> element to indicate insertions and deletions to text.
  • The <del> element should not be used to indicate visually styled text that is not actually deleted. Instead, use CSS styling to achieve the desired visual effect.
  • If the deleted text is relevant to the surrounding context, it may be helpful to include a title attribute on the <del> element to provide additional information about the deleted text.
  • The <del> element can be used within the text of a document, as well as within other HTML elements such as <li> or <blockquote>.
  • To ensure that the meaning of the deleted text is clear, it may be helpful to provide additional context or explanatory text within the same containing element as the <del> element.

Accessibility Considerations

One accessibility consideration for the del element is that it is important to provide context for the deleted text. For example, if you use the del element to strike through a word in a sentence, it may not be clear to users why that word was deleted. In this case, you can use the cite and datetime attributes to provide more context for the deleted text.

The cite attribute can be used to provide a URL that explains the reason for the deletion, and the datetime attribute can be used to specify the time when the deletion occurred. This information can be useful for users who are using screen readers or other assistive technologies to access the content.

Additionally, it is important to ensure that the text within the del element is still readable, even when it is struck through. This can be achieved by using a sufficiently contrasting color for the deleted text, so that it is still visible to users with visual impairments.

Browser Compatibility

ChromeFirefoxSafariInternet ExplorerMicrosoft EdgeOpera
YesYesYesYesYesYes