Webkit奇怪的1px文本下划线答案

【问题标题】：Webkit weird 1px underline on textWebkit奇怪的1px文本下划线
【发布时间】：2011-08-24 06:54:04
【问题描述】：

在http://www.wsl-ltd.co.uk/，我有一个“特别优惠”徽章绝对定位，里面有一些浮动和相对的文字。

出于某种原因，Webkit 浏览器在某些文本上添加了红色下划线 - 我已经尝试了所有方法，但终生无法解决。

有谁知道这是 webkit 的一个奇怪的怪癖，还是我的 CSS？干杯。

【问题讨论】：

【解决方案1】：

问题在于<a> 元素上的样式。我认为您可以在 CSS 中插入以下内容来修复它。

.ie6wrap a {text-decoration:none}

（我查过了，.ie6wrap 只用于一个元素，所以应该是安全的）

如果你想了解更多细节，下面的 CSS 负责：

a:link, a:visited, a:focus{
    color: #d58d31;
    text-decoration: underline;
}

您似乎删除了 <a> 的子元素上的下划线，但 Webkit 不能以这种方式工作，因为下划线在 <a> 下，而不是在子 <div> 上。

【讨论】：

【解决方案2】：

您拥有包含在单个 <a> 标记中的文本的所有跨度，因此文本带有下划线。您需要覆盖样式来处理此问题，或将 <a> 标记移至其他位置。

【讨论】：

【解决方案3】：

发生这种情况是因为这些跨度低于

<a href="contact-us">

具有以下样式：

a:link, a:visited, a:focus {
  color: #D58D31;
  text-decoration: underline;
}

【讨论】：

【解决方案4】：

WebKit 中的错误。

在 <a> 元素本身上定义 text-decoration:none; - 应该会有所帮助。

【讨论】：