Search code examples
htmlunderline

How to Add a Dotted Underline Beneath HTML Text


How do you underline html text so that the line beneath the text is dotted rather than the standard underline? Preferably, I would like to do this without using a separate CSS file. I'm a novice at html.


Solution

  • It's impossible without CSS. In fact, the <u> tag is simply adding text-decoration:underline to the text with the browser's built-in CSS.

    Here's what you can do:

    <html>
    <head>
    <!-- Other head stuff here, like title or meta -->
    
    <style type="text/css">
    u {    
        border-bottom: 1px dotted #000;
        text-decoration: none;
    }
    </style>
    </head>
    <!-- Body, content here -->
    </html>