The CSS text-decoration property sets a text line decoration: underline, overline, line-through or blink in CSS2. In general it used to emphasize or differentiate portions of text. In CSS3, the property is a backward-compatible shorthand which also sets the line color and line style. This CSS3 shorthand is still not supported by most browsers and is not forward-compatible (invalid in CSS2). text-decoration is not inherited.
Browser Support: Full for the CSS1 property, none for the CSS3 shorthand.
Underlining with text-decoration
The most common line decoration is, by far, underline. In CSS2 browsers the line will be solid and the same color of text. In CSS3, the property allows chosing the line style (dashed, dotted...) and color (see next sections).
Keep in mind that the property is not inherited.
The following are the possible values of text-decoration and their results:
Blink is supposed to make the text flash but it's not supported by most browsers.
text-decoration in CSS3
CSS3 makes text-decoration a shorthand for the new text-decoration-line, text-decoration-style and text-decoration-color properties:
text-decoration: line style color
line is the type of decoration (underline, overline, line-through, blink) and the styles are the same available for borders: solid, dashed, dotted, double and wavy.
The new property is in process of being implemented. It is backward compatible but forward incompatible. What this means is that CSS2 rules work in CSS3 but a CSS3 rule specifying the three values is totally invalid in CSS2. For best, support a CSS3 text-decoration rule should provide a fallback like this:
text-decoration: underline; text-decoration: underline dashed #25f165;