下划线 ie6-bug。 <a> 标签中的内联元素答案

【问题标题】：Underline ie6-bug. Inline element in <a> tag下划线 ie6-bug。 <a> 标签中的内联元素
【发布时间】：2011-02-02 09:36:19
【问题描述】：

有一个标记：

<a href="#">
    lorem ipsum<span>15</span>
</a>

有样式：

a{
    text-decoration: underline;
}

a span{
    background: #fff;  //To clean the bottom underlining under <span>
}

适用于所有我感兴趣的浏览器。 IE6 除外。 <span> 下的底部下划线保留。

如何在不更改标记的情况下解决此问题。

a span{
    text-decoration: none;
}

不起作用。

【问题讨论】：

您能发布一个指向该页面的链接吗？我怀疑还有其他东西干扰了这里的样式。
@Olly Hodgson ，有问题。该站点位于本地服务器上。我会努力解决这个问题。
近期解决不了这个问题。
我试图重现这个问题，我也可以在 IE7 和 IE8 上重现它。你为什么只抱怨IE6？您是否也尝试过其他 IE 版本？如果它对你有用，你真的需要用一个完整的SSCCE替换代码（从<!doctype>，<html>直到</html>），这样我们就可以复制'n'paste'run'它.
你解决了这个问题还是仍然相关？

【解决方案1】：

你为什么不试试呢？

a span{
    background: none;
    text-decoration: none;
}

我相信这适用于所有浏览器？

尝试将background: none; 添加到现有的CSS 标记，如上所示。我会尝试看看我是否不能让它在 IE6 上运行。

【讨论】：

【解决方案2】：

尝试将您的 CSS 更改为：

a span {
    background: #fff;
    display: inline-block;
}

尽管其他人已经发布了，text-decoration: none; 不起作用。

【讨论】：

@Marlorn，下划线不会消失。
我收回我对text-decoration: none; 不起作用的评论。添加它，我相信它可以工作。
它对我不起作用。我不知道为什么。可能有任何风格干扰。
我也对此进行了测试。对我来说，background + display 使它适用于除 IE6 之外的所有设备，text-decoration 使它适用于 IE6。

【解决方案3】：

添加到精英绅士的答案：使用条件语句（首选）或下划线破解仅针对 IE6：

a span {
  _text-decoration: none;
}

【讨论】：

【解决方案4】：

这可行吗？

a{
    text-decoration: underline;
}

a span{
    background: #fff;  //To clean the bottom underlining under <span>
    text-decoration: none;
}

【讨论】：