CSS Text Decoration | text-decoration
TextDecorationInthischapteryouwilllearnaboutthefollowingproperties:text-decoration-linetext-decoration-colortext-decoration-styletext-decoration-thicknesstext-decorationAddaDecorationLinetoTextThetext-decoration-linepropertyisusedtoaddadecorationlinetotext.Tip:Youcancombinemorethanonevalue,likeoverlineandunderlinetodisplaylinesbothoverandunderatext.Exampleh1{ text-decoration-line:overline;}h2{ text-decoration-line:line-through;}h3{ text-decoration-line:underline;}p{ text-decoration-line:over...
Text DecorationIn this chapter you will learn about the following properties:
text-decoration-line text-decoration-color text-decoration-style text-decoration-thickness text-decoration Add a Decoration Line to TextThe text-decoration-line property is used to add a decoration line to text.
Tip: You can combine more than one value, like overline and underline to display lines both over and under a text.
Example h1 { text-decoration-line: overline;}h2 { text-decoration-line: line-through;}
h3 { text-decoration-line: underline;}
p { text-decoration-line: overline underline;}
Try it Yourself »[1]Note: It is not recommended to underline text that is not a link, as this often confuses the reader.
Specify a Color for the Decoration LineThe text-decoration-color property is used to set the color of the decoration line.
Example h1 { text-decoration-line: overline; text-decoration-color: red;}h2 { tex...