我试图有一个链接显示在白色,没有下划线。文本颜色正确地显示为白色,但蓝色下划线顽固地坚持。我尝试了文字装饰:没有;文字装饰:none !在CSS中删除链接下划线。既不工作。

.boxhead .otherPage { 颜色:# FFFFFF; 文字修饰:没有; } < div class = "表头栏”> < h2 > <span class="thisPage">当前页面</span> <a href="myLink"><span class="otherPage">Different Page</span></a> . < / h2 > < / div >

如何从链接中删除蓝色下划线?


当前回答

覆盖嵌套的文本装饰样式。

寻找任何::before或::after选择器,并将none显示为任何文本装饰,border-bottom等,或将属性(unset)重置为任何文本颜色属性,如:text-decoration-color, background-color等。

.boxhead .otherPage {
    color: #FFFFFF;
}

a.boxhead .otherPage:before {
    background-color: unset;
}

or

a.boxhead .otherPage:before {
    background-color: unset !important;
}

其他回答

文字装饰:没有!重要的应该删除它..你确定没有边界底部:1px固体潜伏?(在IE中跟踪Firebug/F12中的计算样式)

虽然其他答案都是正确的,但有一个简单的方法可以去掉所有这些讨厌的链接上的下划线:

a {
   text-decoration: none;
}

这将从您的页面上的每一个链接删除下划线!

设置文本装饰:none;对于锚标记。

示例HTML。

<body>
    <ul class="nav-tabs">
        <li><a href="#"><i class="fas fa-th"></i>Business</a></li>
        <li><a href="#"><i class="fas fa-th"></i>Expertise</a></li>
        <li><a href="#"><i class="fas fa-th"></i>Quality</a></li>
    </ul>
</body>

CSS例子:

.nav-tabs li a{
  text-decoration: none;
}

就我而言,我使用的HTML格式很差。链接在<u>标签内,而不是<ul>标签内。

在我的重置,CSS通常是:

a {
  cursor: pointer;
  text-decoration: none !important;
  color: inherit;
}