It is use to set the text decoration thickness.
Syntax -
text-decoration-thickness: value ;
values
length / Percent |
It is use to set thickness as a length or % |
For example -
<html>
<head>
<title>CSS Text Decoration Thickness</title>
<style>
.solid {
text-decoration: underline overline;
text-decoration-style: solid;
text-decoration-thickness: 5px;
}
.double {
text-decoration: underline overline;
text-decoration-style: double;
text-decoration-thickness: 3px;
}
.dotted {
text-decoration: underline overline;
text-decoration-style: dotted;
text-decoration-thickness: 2px;
}
.dashed {
text-decoration: underline overline;
text-decoration-style: dashed;
text-decoration-thickness: 50%;
}
.wavy {
text-decoration: underline overline;
text-decoration-style: wavy;
text-decoration-thickness: 10%;
}
</style>
</head>
<body>
<p class="solid">its show solid line with thickness 5px</p><br>
<p class="double"> its show double line with thickness 3px </p><br>
<p class="dotted">its show dotted line with thickness 1px</p><br>
<p class="dashed"> it show dashes line with thickness 50% </p><br>
<p class="wavy"> it show wavy line with thickness 10%</p>
</body>
</html>
Output