Text-decoration-style Property in CSS3

How to add style to the text decoration in CSS3?

By using text-decoration-property we can add style to the text decoration.

 <style>
        p {
        text-decoration-line:underline;
        text-decoration-style:dotted
        }
        div {
        text-decoration:underline;
        text-decoration-style:dashed;
        }
        b {
        text-decoration:underline;
        text-decoration-style:wavy;
        }
</style>

<body>
    <p>
        This is Correct sentence.
    </p>
    <div>
        This is Wrong senetnce.
    </div>
    <b>This is Bold content.</b>
</body>

In the above codes snippet we have given the text-decoration-style property with different values to the <p> element, <div> element, <b> element. The text-decoration-style property with value "dotted" gives the dotted underline to the text of <p> element. The text-decoration-style property with value "dashed" gives the dashed underline to the text of <div> element. The text-decoration-style property with value "wavy" gives the wavy undeline to the text of <b> element.

OUTPUT

Views: 3247 | Post Order: 94

CSS3 > Texts

Text-decoration-style Property in CSS3

How to add style to the text decoration in CSS3?

Related Posts

Utility Tools