In this section, we will learn what the text-decoration-line property is and how to use it in CSS.
CSS text-decoration-line Property Definition and Usage
CSS is all about appearances!
So far, pretty much any property we’ve introduced affects the text itself. For example, styling, changing the size, uppercasing, changing the font type, changing the color of text, etc.
There’s another property called `text-decoration-line` that we can use to decorate a text.
This property decorates a text content by adding lines to it.
CSS text-decoration-line Property Syntax
CSS text-decoration-line Property Value
There are 3 values that we can assign to this property:
- underline: using the value “underline” we can add a line right under the text.
- overline: using the value “overline” we can add a line right on top of the text.
- line-through: using the value “line-through” we can add a line that passes through the text.
Note: by default, this property inherits its value from its parent.
Example: CSS line through
Remove Underline CSS
By default, an HTML element like <a> has a line decorated under its text content.
Now that we know CSS text-decoration-line property is in charge of this line, we can easily remove it whenever it’s needed.