CSS – Underline Text

To underline text of HTML Element(s) using CSS, set CSS text-decoration property for this HTML Element(s) with underline.

text-decoration: underline;

Underline Heading

In the following example, we underline text of heading <h1> element.

Example

</>
Copy
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <style>
        #e1 {
            text-decoration: underline;
        }
    </style>
</head>
<body>
    <h1 id="e1">Hello World</h1>
</body>
</html>

Underline Paragraph

In the following example, we underline text of paragraph <p> element.

Example

</>
Copy
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <style>
        #p1 {
            text-decoration: underline;
        }
    </style>
</head>
<body>
    <p id="p1">This is a paragraph.</p>
</body>
</html>

References

CSS text-decoration

Conclusion

In this CSS Tutorial, we learned how to remove underline for anchor element using CSS.