如何仅为特定链接没有下划线?

时间:2015-02-23 17:06:20

标签: css

我有一个问题可能很容易,但我似乎无法弄明白。除了悬停,活动或焦点外,我得到的所有链接都没有下划线:

a {
    text-decoration: none;
}
a:hover, a:focus, a:active {
    text-decoration: underline;
}

现在,我在HTML中的结构是这样的:

<div class="filter-wrapper">
  <a href="">
      <span class="filter-tag">
        Tag Name
      </span>
  </a>
</div>

我不希望在悬停,活动或仅关注该div的任何下划线。我如何实现这一目标?

我尝试用文字装饰做一个特殊的课程:没有,但它似乎没有用。我觉得很蠢。

1 个答案:

答案 0 :(得分:3)

.filter-wrapper a:hover, .filter-wrapper a:focus, .filter-wrapper a:active {
    text-decoration: none;
}

&#13;
&#13;
    .filter-wrapper a:hover,
    .filter-wrapper a:focus,
    .filter-wrapper a:active {
      text-decoration: none;
    }
    a {
      text-decoration: none;
    }
    a:hover,
    a:focus,
    a:active {
      text-decoration: underline;
    }
&#13;
<div class="filter-wrapper">
  <a href="">
    <span class="filter-tag">
        Tag Name
      </span>
  </a>
</div>

<a href="#">Test</a>
&#13;
&#13;
&#13;