HTML <del> Tag for Deleted Content

 

ATTENTION: THIS PAGE IS Valid HTML 5 AND IS BEST VIEWED WITH HTML 5 - Please upgrade your browser or download one of the HTML 5 compatible browsers such as Mozilla Firefox, Chrome, Opera or IE 9 (March 14, 2011 or later). For more information see HTML 5 browsers.


If you find this helpful, please click the Google +1 Button to the left, if it is white, to make it turn blue or red. Thank you! (It also helps find this page again more easily.)


PDF mobile

The <del> Tag in HTML 5

The <del> tag for deletions is one of the editing tags for tracking changes in HTML 5. It is used to mark up text and/or HTML code to indicate that it has in effect been removed instead of actually deleting it from the document. This approach to editing changes in HTML documents can be used to provide a standing record of the original text of articles, blog entries or other edited documents. When the deletions are to be displayed, a different style, often text-decoration: line-through to select a strike-through font, can be used to provide a visual indication of the deleted content or the deletions can be hidden from view with the display: none style.

Likewise, the <ins> editing tag can be used to mark up new text and/or HTML code inserted into a document.

The difference between the <s> (strike) and <del> tags is that <del> is, in effect, as good as deleting the content from the document, while striking content using the <s> tag is for content that is to be included in the document and just visually appear as stricken.


<del> Tag Syntax

<body>
   ... flow content expected ...
   <del cite="changelog-URL" datetime="yyyy-mm-ddThh:mm:ss+zz:00">
      ... flow content ...
   </del>
   ...
   ... phrasing content expected ...<del cite="changelog-URL"
      datetime="yyyy-mm-ddThh:mm:ss+zz:00">...
   ... phrasing content ...</del>...
   ...
</body>
Rules for coding the HTML del element

Make sure you understand the difference between a tag and element and are familiar with the definitions of namespace and other HTML terms.

  1. Code the del element for deleted text and/or HTML code where either flow content is expected or phrasing content is expected.
  2. Begin the del element with a starting <del> tag. The element name uses lower case letters and should be in the HTML namespace, which it will pick up automatically from the xmlns attribute on the <html> tag.
  3. Optionally code a cite attribute with the URL of a document that provides an explanation for the change.
  4. Optionally code a datetime attribute with the date or date and time of the change.
  5. Include any other global attributes inside the starting <del> tag as appropriate.
  6. Inside the del element, include the text or other phrasing content that is being deleted. If the <del> tag is coded where flow content is permitted, then the inner HTML of the <del> tag may contain flow content also.
  7. End the del element with a matching </del> closing tag.
Content Model
Content of the a element
When coded in flow content

When coded in flow content, the content of the del element can include HTML comments, text content and any HTML tags that can be used in flow content.

When coded in phrasing content

When coded in phrasing content, the content of the del element can include HTML comments, text content and only those HTML tags that can be used in phrasing content.


<del> Tag Attributes

Attributes of the <del> tag
global attributes In addition to the personal attributes of the <del> tag below, any of the common HTML attributes can also be coded.
cite

a URI reference (or IRI reference depending on the encoding) that resolves to the URI of a document that explains the reason for the deletion or a fragment of a document describing multiple changes.

Use percent escape codes as explained in the URL Encoding Tutorial for any special characters in the URI reference.

If the value of the cite attribute is an HTTP URI, it may contain any of the following components:

  1. protocol scheme, typically http: or else https:
  2. username, followed by an "@"
  3. host name or IP address
  4. port number, which defaults to 80 for the http scheme and 443 for the https scheme
  5. absolute or relative path
  6. search query, indicated by "?"
  7. fragment identifier, indicated by "#"

If the protocol scheme, username, host name/IP address and port number are omitted the default is the current host - the same server as the base of the current document. If the path starts with a slash /..., it is an absolute path from the document root directory (AKA "web root") on the server. A relative path will be resolved relative to the base of the current document. A URI with a "#" but no fragment identifier points to the top of the document.

datetime="mm/dd/yyyy"
datetime="mm/dd/yyyyThh:mm-zz:zz"
The datetime attribute contains the date or date and time that the change was made.

<del> Tag Examples

Examples of the del tag in HTML 5
<p>... <del datetime="2010-10-31">deleted from paragraph on Halloween 2010</del> ...</p>

<del datetime="2010-11-30T23:59-05:00"><p>This entire paragraph was
   deleted just before midnight Eastern time on the last day of November.
</p></del>

<p>... <del datetime="2010-10-31">This is just one reason for
   always using the &lt;p&gt; tag for paragraphs in HTML.</del>
</p>
<p><del datetime="2010-10-31">Another reason is that it</del>
   <ins>Using the &lt;p&gt; tag</ins> is highly recommended by the HTML specifications, which says
   <a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/edits.html#edits-and-paragraphs">
      "authors are strongly encouraged to always mark up all paragraphs with the p element"</a>.
</p>

The last example includes an insertion using HTML editing code and also shows that a single <del> tag cannot be used to mark up part of one paragraph along with another paragraph since that would result in mismatched tags. Two <del> tags need to be used for that. This rule applies even if the <p> tags for one of the paragraphs were implied rather than coded explicitly.

Deleting List Items in HTML 5

Deletion of a list item from an HTML list is indicated by coding the <del> tag inside the <li> tag:

<ul>
<li>first list item</li>
<del><li>deleted list item</li></del>
<li><del>deleted list item</del></li>
</ul>

Changes in HTML 5 - <del> Tag

What's new in HTML 5
Differences between HTML 5 and earlier versions of HTML

The 2000-2010 Recommendations from the W3C HTML Working Group defined the HTML namespace for the del element type name along with the names of all HTML element types. In older (pre-2000) versions of HTML, element type names were not associated with a namespace.


Valid HTML 5