CSS Text Decoration
CSS Text Decoration is a module of CSS that defines features relating to text decoration, such as underlines, text shadows, and emphasis marks.
Reference
Properties
text-decoration
text-decoration-color
text-decoration-line
text-decoration-skip-ink
text-decoration-style
text-decoration-thickness
text-emphasis
text-emphasis-color
text-emphasis-position
text-emphasis-style
text-shadow
text-underline-offset
text-underline-position
Guides
None.
Examples
.under { text-decoration: underline red; } .over { text-decoration: wavy overline lime; } .line { text-decoration: line-through; } .plain { text-decoration: none; } .underover { text-decoration: dashed underline overline; } .thick { text-decoration: solid underline purple 4px; } .blink { text-decoration: blink; }
<p class="under">This text has a line underneath it.</p> <p class="over">This text has a line over it.</p> <p class="line">This text has a line going through it.</p> <p>This <a class="plain" href="#">link will not be underlined</a>, as links generally are by default. Be careful when removing the text decoration on anchors since users often depend on the underline to denote hyperlinks.</p> <p class="underover">This text has lines above <em>and</em> below it.</p> <p class="thick">This text has a really thick purple underline in supporting browsers.</p> <p class="blink">This text might blink for you, depending on the browser you use.</p>
Specifications
Specification | Status | Comment |
---|---|---|
CSS Text Decoration Module Level 4 | Working Draft | |
CSS Text Decoration Module Level 3 | Candidate Recommendation | |
CSS Level 2 (Revision 1) | Recommendation | |
CSS Level 1 | Recommendation | Initial definition |
© 2005–2021 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Text_Decoration