Data Structure
Networking
RDBMS
Operating System
Java
MS Excel
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
Display strikethrough text in HTML
Strikethrough Text
Strikethrough text means text with a line through it. The <strike> tag was used in HTML4 to create a strikethrough text, but it is not supported in HTML5. Instead, the <del> tag is used in HTML5 to define deleted text.
Syntax
Following is the usage of strikethrough tag in HTML ?
<strike>text?. </strike>
Example: Displaying Strikethrough Text
The following example demonstrates the use of the <strike> tag to display strikethrough text. This HTML code creates a webpage with the heading "TutorialsPoint" and a paragraph stating "It is an Edutech Company handles all Technical Non-Technical Subjects," with "Non-Technical" text struck through.
<!DOCTYPE html> <html> <body> <h2>TutorialsPoint</h2> <p>Its an Edutech Company handles all Technical <strike>Non-Technical</strike> Subjects </p> </body> </html>
Example: The <del> Tag for Strikethrough Effect
In this example, we are using the <del> tag to achieve the strikethrough effect. This HTML code creates a webpage with the heading "My World" and a subheading" I Like Blue, red, and Pink colors," with the "Red" text struck through and displayed in red color.
<!DOCTYPE html>
<html>
<head>
<style>
del {
color: red;
}
</style>
</head>
<body>
<h1>My World</h1>
<h2>
I Like Blue , <del>Red</del>, Pink colors
</h2>
</body>
</html>
Example: Highlighting Text
We can also use the <ins> tag to highlight text by underlying it. The following example demonstrates the usage of the <ins> tag in HTML. This HTML code creates a webpage with the red heading "My World" and a subheading "I like Orange, blue, red, pink colors!" with the "blue" text struck through and the "red" text inserted.
<!DOCTYPE html>
<html>
<head>
<style>
h1 {
color: red;
}
</style>
</head>
<body>
<h1>My World</h1>
<h2>
I Like Orange , <del>blue</del>
<ins>red</ins>, Pink colors!
</h2>
</body>
</html>
Example: Incorrect Markup Text
The following example demonstrates markup text that is no longer correct. This HTML code creates a webpage with the red heading "My World" and a subheading "I like red, black colors!" with the text struck through, followed by another subheading "But Everyone likes Pleasant colors."
<!DOCTYPE html>
<html>
<head>
<style>
h1{
color: red;
}
</style>
</head>
<body>
<h1>My World</h1>
<h2><s>I Like red, black colors!</s></h2>
<h2>But Everyone likes Pleasant colors</h2>
</body>
</html>
796 Views
