尽管使用了'text-decoration: none;”，为什么我的链接仍然带有下划线？-css教程-PHP中文网

尽管使用了'text-decoration: none;”，为什么我的链接仍然带有下划线？

Susan Sarandon

发布： 2024-12-19 19:25:11

原创

911 人浏览过

Why Is My Link Still Underlined Despite Using `text-decoration: none;`?

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

问题：

您有一个链接显示为白色，但令人沮丧的是仍然带有蓝色下划线。尽管应用了 text-decoration: none;，即使使用 !important 规则，下划线也拒绝移动。

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

登录后复制

解决方案：

经过仔细检查，您发现文本装饰：无；规则应用不正确。您将其应用于跨度元素 (.boxhead)，但它应该直接应用于锚元素 (.boxhead a)。

.boxhead a {
    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>

登录后复制

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

登录后复制

通过应用此更正，您将成功从链接中删除蓝色下划线，使其以白色显示，而无需任何不必要的干扰。

以上是尽管使用了'text-decoration: none;”，为什么我的链接仍然带有下划线？的详细内容。更多信息请关注PHP中文网其他相关文章！