css - 从链接中删除蓝色下划线

Question

我试图让一个链接显示为白色，没有下划线。文本颜色正确显示为白色，但蓝色下划线顽固地存在。我在 CSS 中尝试了 text-decoration: none; 和 text-decoration: none !important; 来删除链接下划线。都没有用。

.boxhead .otherPage {
  color: #FFFFFF;
  text-decoration: none;
}

<div class="boxhead">
  <h2>
    <span class="thisPage">Current Page</span>
    <a href="myLink"><span class="otherPage">Different Page</span></a>
  </h2>
</div>

如何去除链接中的蓝色下划线？

Answer 1

您没有将 text-decoration: none; 应用于 anchor (.boxhead a)，而是应用于跨度元素 (.boxhead ).

试试这个:

.boxhead a {
    color: #FFFFFF;
    text-decoration: none;
}