Question

我正在显示一些文字，并在其下面出现一条蓝线

与此问题相同

Text being displayed with a blue underlining, where is it coming from?

答案和其他人说它对html4无效，但对html5有效。为什么在这种情况下小提琴会出现这个问题？什么是解决方案？

由于

Answer 1

它来自您的<a> - 因为一切都包含在其中。要删除它，只需应用：

a {
    text-decoration: none
}

DEMO

Answer 2

这是您的代码

<ul>
  <a href="http://whatever">
    <li id = "header_list">
      <div id = "main_title">title</div>
      <img id = "logo" src="logo.png"/>
    </li>
  </a>
</ul>

div id =“main_title”在锚标记内，这意味着它是一个链接。默认情况下，链接样式具有蓝色下划线。您可以添加css样式以删除蓝色下划线：

#main_title {text-decoration: none; color: #000;}

另外，你应该在ul之后直接放置li标签，因为它需要是直接的孩子：

<ul>
  <li id = "header_list">
    <a href="http://whatever">
      <div id = "main_title">title</div>
      <img id = "logo" src="logo.png"/>
    </a>
  </li>
</ul>

Answer 3

您只需更改链接的样式（所有文字都在<a>标记内）：

a{text-decoration:none;}

Answer 4

它位于<a>标记内，默认情况下将使用下划线进行渲染。通过为链接设置text-decoration: none来更改默认行为，它应该可以正常工作。 `

Answer 5

默认情况下，锚标记a的{{1}}定义为text-decoration。您只需将underline属性添加到CSS定义即可解决此问题。

我还应该指出你的标记并不完全正确。您的锚点应该在列表项text-decoration: none;中，并且在内联块元素li中包含块元素div通常不是一个好主意。

以下是jsfiddle的更新版本，用于演示我的意思：http://jsfiddle.net/CmVsJ/2/

在文本下出现不需要的下划线

5 个答案: