clock  Mon - Sun 8.00 AM - 8.00 PM
mail  edu@teknowize.com
fb
instagram
play store
pinterest

More

CSS Text Decoration Style

Imperial Advance Hero Image

CSS Text Decoration Style

It is use to set the text decoration style like solid, wavy, dotted, dashed, double.

 

Syntax -

text-decoration-style : value ;

 

values

solid

It is use to draw a single line

wavy

It is use to draw a wavy line
dotted
It is use to draw a dotted line.
dashed It is use to draw dashed line.
double It is use to draw double line. 

 

For example -

<html>

<head>
    <title>CSS Text Decoration Style</title>

    <style>
        .solid {
            text-decoration: underline overline;
            text-decoration-style: solid;
        }

        .double {
            text-decoration: underline overline;
            text-decoration-style: double;
        }

        .dotted {
            text-decoration: underline overline;
            text-decoration-style: dotted;
        }

        .dashed {
            text-decoration: underline overline;
            text-decoration-style: dashed;
        }

        .wavy {
            text-decoration: underline overline;
            text-decoration-style: wavy;
        }
    </style>
</head>

<body>
    <p class="solid">its show solid line</p><br>
    <p class="double"> its show double line </p><br>
    <p class="dotted">its show dotted line</p><br>
    <p class="dashed"> it show dashes line </p>
    <p class="wavy"> it show wavy line </p>
</body>

</html>

 

Output

Text Decoration

CSS