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

Question

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

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的任何下划线。我如何实现这一目标？

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

Answer 1

.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;