You can apply strikethrough to a text using the following CSS property/value:
.foo { text-decoration-line: line-through; }
Or, using the shorthand version:
.foo { text-decoration: line-through; }
Please note that, in CSS3+ it is also possible to change the color of the strikethrough to be different than the color of the text.
It might also be useful to know that the text-decoration-line
(as well as the shorthand text-decoration
) property allows multiple values separated by space. Therefore, you can easily combine strikethrough with any other text-decoration
value(s). For example, the following would add a strikethrough and underline to the text:
.foo { text-decoration: line-through underline; }
.foo { text-decoration-line: line-through underline; }
This post was published by Daniyal Hamid. Daniyal currently works as the Head of Engineering in Germany and has 20+ years of experience in software engineering, design and marketing. Please show your love and support by sharing this post.