我有一个问题可能很容易,但我似乎无法弄明白。除了悬停,活动或焦点外,我得到的所有链接都没有下划线:
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的任何下划线。我如何实现这一目标?
我尝试用文字装饰做一个特殊的课程:没有,但它似乎没有用。我觉得很蠢。
答案 0 :(得分:3)
.filter-wrapper a:hover, .filter-wrapper a:focus, .filter-wrapper a:active {
text-decoration: none;
}
.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;