发表新帖
发表新帖

How to Add a Dotted Underline Beneath HTML Text

后端 未结
关注
9 1532
挽巷
挽巷 2020-12-23 19:54

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 C

相关标签:
9条回答
  • 南方客
    2020-12-23 20:53

    Without CSS, you basically are stuck with using an image tag. Basically make an image of the text and add the underline. That basically means your page is useless to a screen reader.

    With CSS, it is simple.

    HTML:

    <u class="dotted">I like cheese</u>

    CSS:

    u.dotted{
  border-bottom: 1px dashed #999;
  text-decoration: none; 
}

    Running Example

    Example page

    <!DOCTYPE HTML>
<html>
<head>
    <style>
        u.dotted{
          border-bottom: 1px dashed #999;
          text-decoration: none; 
        }
    </style>
</head>
<body>
    <u class="dotted">I like cheese</u>
</body>
</html>
    0 讨论(0)
  • 小蘑菇
    2020-12-23 20:55

    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>
    0 讨论(0)
  • 耶瑟儿～
    2020-12-23 20:57

    Use the following CSS codes...

    text-decoration:underline;
text-decoration-style: dotted;
    0 讨论(0)
 看不清?
提交回复
热议问题