css - 我无法去掉下划线文本

Question

我得到了这个代码:

<div class="class1"><a href="http://nvm/">text</a></div>

class1的CSS代码如下:

.class1 {
       text-decoration: none;
}

输出会一直显示，直到我将鼠标移到 div 上。然后文本带有下划线。

当然，我已经尝试了很多方法，例如:

.class1:hover {
      text-decoration: none;
}

我还尝试添加 !important 属性，但仍然没有达到预期的结果。 :/

我还使用firebug调试了HTML和CSS代码，但找不到任何具有属性text-decoration: underline;的类。

我知道这是一个很愚蠢的问题，但我没有主意。

Answer 1

您应该将 .class1 内的 a 元素的 text-decoration 属性设置为 none，因为这是包含文本的元素(也可能是您悬停的元素)。

例如:

.class1 a(祖先为 .class1 的所有 a 标记)

或者

.class1 > a(父级为 .class1 的所有 a 标记)