从锚内部的跨度中删除下划线

Question

我有这个HTML:

<ul>
<li>
    <ul>
        <li>
            <a href="#"> <span> Test </span> Link </a>
        </li>
    </ul>
</li>
</ul>?

这个CSS:

ul li ul li span {

    text-decoration:none;
}?

为什么锚内的跨度仍有下划线？

换句话说:除了 SPAN 之外,我如何得到所有加下划线的文本.谢谢

Answer 1

你需要定位anchor tag而不是span tag这样使用它

ul li ul li a {
    text-decoration:none;
}?

原因:默认情况下text-decoration: underline;应用于<a>标记浏览器样式表,因此如果您想过度使用它,或者您希望<a>网站上的任何标记都没有下划线而不是简单地使用此标记

a {
   text-decoration: none;
}

编辑:当我阅读你的评论时,如果你希望你的文字是下划线除了文本<span>之外使用它

演示

ul li ul li a {
    text-decoration:underline;
}

ul li ul li a span {
    text-decoration:none;
    display: inline-block;
}