text-decoration is a shorthand for
text-decoration-line, text-decoration-color,
text-decoration-style, and text-decoration-thickness
properties.
Let's look at an example where we are setting a value
for each of the properties mentioned above.
While we can set each property a value, there are some default values as well, like:
Now let's try removing properties one by one to understand the default values:
Example:
In the example above if we don't specify the text-decoration-thickness
value, it becomes 1px as default.
Similarly, let's try removing the text-decoration-color:
In the example above we could observe that the underline is
of the same color as the element's text color, i.e. blue.
Now, let's try removing the text-decoration-style: