Deleted Text Example

How to mark deleted text in HTML?

We use tag, to delete a text in HTML. This tag mark strike on the text which is to be delete from the document.

We can also use the style attribute, to strike a text in HTML. The style attribute specifies an inline style for an element. This attribute is used inside the HTML

tag, with the CSS property text-decoration property.

Syntax

Following is the syntax to delete a text in HTML.

 The content to be deleted 

Example

Following is the example program to delete a text in HTML.

DOCTYPE html> html> head> head> body> p>DLF stands fordel>Delhi Land and Finance.del>p> p>Delhi Land and Finance is one of the largest commercial real estate developer in India.p> body> html> 
 

Example

In the example below, we used tag on a particular text inside the tag.

DOCTYPE html> html> head> title>HTML u tagtitle> head> body> h1>Welcome to del> Disney land del> Kids.h1> body> html> 
 

Marking deleted text by inline CSS

Using CSS property for deleting a text in HTML.

Syntax

Following is the syntax to delete a text in HTML using CSS property.

The content to be underlined
 

Example

Following is the example program to delete a text in HTML using CSS property.

DOCTYPE html> html> head> head> body> p>DLF stands forp>p style="text-decoration:line-through;">Delhi Land and Financep> p>Delhi Land and Finance is one of the largest commercial real estate developer in India.p> body> html> 
 

Источник

The HTML Tag

The del tag in HTML represents deleted text and is often used to only delete a section of text inside a paragraph or heading.

How to use the Delete Tag

The del tag requires an opening and closing tag wrapping text that should have an effect applied like this:

p>The quick brown del>foxdel> cat jumps over the lazy dog.p> 

The quick brown fox cat jumps over the lazy dog.

The default behaviour of the del tag in most browsers is to display text with a strikethrough, which is typically a small line through the middle of the text.

Creating Spoiler Text with the Delete Tag

Another tag that has the same default styling as the del tag is the HTML s tag, we can therefore change the del tag to completely hide text using CSS while maintaining the ability to create regular strikethroughs.

p>The quick brown del>foxdel> cat jumps over the lazy dog.p> 

del  color: #000; background: #000; text-decoration: none; > 

The way this CSS example works is to make the background color the same as the text color on the content inside all del tags.

We could improve this to reveal the text on hover with a transition for a nice fade-in effect like this:

p>The quick brown del>foxdel> cat jumps over the lazy dog.p> 

del  color: #000; background: #000; text-decoration: none; transition: all 0.5s; > del:hover  background: transparent; > 

Provide a Citation on Deleted HTML Text

To provide a citation for some deleted text in HTML use the cite attribute on the del tag passing a URL as the content.

p>The quick brown del cite="/reason_why.html">foxdel> cat jumps over the lazy dog.p> 

Provide a Time of Deletion in HTML Text

It is possible to provide a time of deletion of a selection of text by using the datetime attribute on the del tag like this:

p>The quick brown del datetime="1955-11-12T06:00:00Z">foxdel> cat jumps over the lazy dog.p> 

The date format when broken down works like this:

• YYYY — year
• MM — month (02 for February .etc)
• DD — day of the month (08)
• T or a space — a separator for the time part of the date
• hh — hour (24-hour clock)
• mm — minutes (55 for example)
• ss — seconds (03 for example)
• TZD — Time Zone Designator

Browser Support

The del tag is supported by all popular web browsers including, Chromium, Firefox, Internet Explorer, Safari and Opera.

Conclusion

The del HTML tag is useful for deleting text with a different style than a strikethrough and providing a citation for the reason of deletion and the date of deletion.

Источник

How to define a text that has been deleted from the document in HTML5?

In HTML5, deleted content can be marked up using the element. The element is used to signify content that has been deleted from a document. When used, the content enclosed within the element will be displayed with a strikethrough style. This can be helpful for showing changes made to a document or indicating that certain information is no longer accurate. Additionally, the element can be used in conjunction with the element to indicate changes that have been made to a document, with the element used to mark up inserted text.

Approaches

In HTML5, there are several methods for defining deleted content, including −

Let us look at each approach in detail with examples now.

Approach 1: Using the « Tag

The first approach to define a text that has been deleted from the document in HTML5 is by using the Tag. Text from the initial content that has been deleted or removed is marked up using this tag. It is frequently used to indicate changes made to a document, such as when editing a web page or when reviewing a document.

Example

Here, we will go through a example to implement this approach −

     
Deleted Text Example
 
This is some text that has been deleted from the document.
   

Approach 2: The or Tag

The second approach to define a text that has been deleted from the document in HTML5 is by using the or Tag. When deleting text from a document, these tags are used to strike through the removed text. They are less frequently used than the del> element, but they have their uses.

Example

Here, we will go through a example to implement this approach −

     
Deleted Text Example
 
This is some text that has been deleted from the document.
   

Approach 3: The Tag

The third approach to define a text that has been deleted from the document in HTML5 is by using the Tag. This tag is used to draw attention to deleted content from a document. It is helpful for drawing attention to edits made to a text.

Example

Here, we will go through a example to implement this approach −

     
Deleted Text Example
 
This is some text that has been deleted from the document.
   

Conclusion

In HTML5, there are several methods for defining deleted content. The most popular method for marking up text that has been deleted or removed from the original material is the tag. The removed text can also be highlighted using the tag, while it can also be struck through using the and tags.

In order to properly define deleted text in HTML5, it’s crucial to take the context and target population into account. Reader comprehension of the content can be improved, as well as the integrity of the document, by providing clear and concise information about modifications made to it.

Источник

HTML Tag

The HTML tag represents deleted text in an HTML document.

Marking text as deleted is often used for determining differences between multiple versions of the same document. Browsers will typically strike a line through deleted text.

Syntax

The tag is written as with the deleted text inserted between the start and end tags.

Examples

Basic Usage Example — A «To Do» List

The tag can be used in a «to do» list to markup items that have been done.

Date & Time

The datetime attribute allows you to add a date and (optionally) a time. This attribute is mainly intended for private use (e.g. by server-side scripts collecting statistics about a site’s edits), but it could potentially be displayed to users.

Here, we can add date and time information to items that have been crossed off our «to do» list.

Citations

You can add a citation using the cite attribute. The value of this attribute must be the URL of a document that explains the change. This attribute is not intended for readers of the document. Rather, it is intended for private use (e.g. by server-side scripts collecting statistics about a site’s edits).

Inserting New Text

Deleted text is often accompanied by inserted text. This often happens when out-dated information needs to be deleted and new information is added. To insert new text, use the tag.

Deleting Table Rows &/or Columns

To delete a table row or column, you need to apply the tag to the content within those rows/columns. You can’t simply enclose a tag or tag within tags.

Delete Table Row

Delete Table Row

Attributes

Attributes can be added to an HTML element to provide more information about how the element should appear or behave.

The element accepts the following attributes.

Attribute	Description
cite	Indicates a source that should indicate the reason for the change.
datetime	Date and time of change.

Global Attributes

The following attributes are standard across all HTML elements. Therefore, you can use these attributes with the tag , as well as with all other HTML tags.

• accesskey
• autocapitalize
• class
• contenteditable
• data-*
• dir
• draggable
• hidden
• id
• inputmode
• is
• itemid
• itemprop
• itemref
• itemscope
• itemtype
• lang
• part
• slot
• spellcheck
• style
• tabindex
• title
• translate

For a full explanation of these attributes, see HTML 5 global attributes.

Event Handlers

Event handler content attributes enable you to invoke a script from within your HTML. The script is invoked when a certain «event» occurs. Each event handler content attribute deals with a different event.

• onabort
• onauxclick
• onblur
• oncancel
• oncanplay
• oncanplaythrough
• onchange
• onclick
• onclose
• oncontextmenu
• oncopy
• oncuechange
• oncut
• ondblclick
• ondrag
• ondragend
• ondragenter
• ondragexit
• ondragleave
• ondragover
• ondragstart
• ondrop
• ondurationchange
• onemptied
• onended
• onerror
• onfocus
• onformdata
• oninput
• oninvalid
• onkeydown
• onkeypress
• onkeyup
• onlanguagechange
• onload
• onloadeddata
• onloadedmetadata
• onloadstart
• onmousedown
• onmouseenter
• onmouseleave
• onmousemove
• onmouseout
• onmouseover
• onmouseup
• onpaste
• onpause
• onplay
• onplaying
• onprogress
• onratechange
• onreset
• onresize
• onscroll
• onsecuritypolicyviolation
• onseeked
• onseeking
• onselect
• onslotchange
• onstalled
• onsubmit
• onsuspend
• ontimeupdate
• ontoggle
• onvolumechange
• onwaiting
• onwheel

Most event handler content attributes can be used on all HTML elements, but some event handlers have specific rules around when they can be used and which elements they are applicable to.

Источник