Text Decoration

text-decoration is used to add features such as underlines, linethroughs, and wavy lines (just to name a few) to sections of text. This works like the <u> </u> tags in HTML - its basically just the CSS version of the HTML tags! It also has a sub property called text-decoration-color!

Text Decoration Color

text-decoration-color allows you to change the color of the underline, wavyline, or whatever stye of text decoration you have used within your CSS stylesheet. Similar to color, you can determine the color of the decoration by by giving the property the name of a color i.e. white, yellow, green, or you can give it something fancier called a hex code! See the color page to grab some more info on this property.

Example

Here’s an example of how text-decoration and text-decoration-color can be used in a CSS stylesheet!

h2 {
    text-decoration: underline; 
    text-decoration-color: pink; 
}

If you want to know more about the text-decoration property, you can go to the links at MDN Web Docs or w3schools.

To learn more about text-decoration-color, you can go to the links at MDN Web Docs or w3schools.

Both of these sites give excellent examples of how the text-decoration and text-decoration-color CSS properties work! These sites are interactive, and allow you to change and alter the values to see how the property works, and just overall great resources!