text-decoration

Article
10/10/2017

Sets a value that indicates whether the text in the object has line-through, overline, or underline decorations.

Syntax

{ text-decoration: sDecoration }

Possible values

sDecoration

String that specifies one of the following values:

none	Default. Text has no decoration.
line-through	Text has a line drawn through it.
overline	Text has a line over it.
underline	Text is underlined.

The property has a default value of none and is not inherited.

Remarks

The default value is different for the following tags:

Default value is underline for the A element when used with the HREF, U, and INS elements.
Default value is line-through for the STRIKE, S, and DEL elements.

If the value none is placed at the end of the values, all values are cleared. For example, setting {text-decoration: underline overline blink none} causes none of the decorations to render.

If the object has no text (for example, the IMG object in HTML) or is an empty object (for example, <EM></EM>), this property has no effect.

If you set the text-decoration property to none on the BODY object, the A objects are still underlined. To remove the underline from the A objects, either set the style inline or use a as a selector in the global style sheet.

Specifying the text-decoration property for block elements affects all their inline child elements. If it is specified for, or affects, an inline element, it affects all boxes generated by the element.

Examples

The following example uses the text-decoration property to decorate text within the object. This example uses an inline style sheet to draw a line through the text within the object:

<div style="text-decoration:line-through">
.
.
.
</div>

This example demonstrates that text-decoration is not inheritable. The child (the SPAN element) appears to inherit its style from its parent (the DIV element), but, in fact, it does not:

<html>
<head><style>
    div{color:red; text-decoration:underline;}
    span{color:blue; text-decoration:none;}
</style>
</head>
<body>
<div>This div has text decoration set to underline <span>, but this span
        has it set to none. </span> The div continues here.</div>
</body>
</html>

Standards information

This property is defined in Cascading Style Sheets (CSS), Level 1 (CSS1) Ee371276.xtlink_newWindow(en-us,Expression.40).png .

Applies to

a, address, b, big, blockquote, body, button, caption, center, cite, code, col, colgroup, custom, dd, defaults, dfn, div, dl, dt, em, fieldset, form, hn, html, i, input type=button, input type=file, input type=password, input type=radio, input type=reset, input type=submit, input type=text, li, ol, p, s, select, span, sub, table, tbody, td, tfoot, th, thead, tr, tt, u, ul, var, xmp