CSS text-decoration – underline, overline and strikeout text

CSS property text-decoration describes decorations that are added to the text of an element using the element’s color. Few points to note about text-decoration

1. Underlines, overlines, and line-throughs are applied only to text (including white space, letter spacing, and word spacing).
2. margins, borders, and padding are skipped
3. Value blink is not well supported (does not work in Chrome)

CSS property text-decoration

text-decoration values

Example – text-decoration

<style> 
span {margin: 5px;}
.underline {text-decoration: underline;}
.overline {text-decoration: overline;}
.line-through {text-decoration: line-through;}
</style>

<span class="underline">Underline example</span>
<span class="overline">Overline example</span>
<span class="line-through">Line through example</span>

Related

• CSS letter-spacing - additional spacing between adjacent chars
• CSS text-align - align text left, right or justify
• CSS text-indent - indent text in a block
• CSS text-transform - capitalize, uppercase and lowercase text
• CSS word-spacing - additional space between words

Specification

• W3C CSS 2.1 text-decoration specification