如何删除奇怪的蓝色下划线

问题描述：

正如我在标题中提到的，我找不到什么是错误的，我甚至不知道为什么指针悬停时为蓝色。
DEMO：https://anniesnoopymd.github.io/web-final-project/dist/new.html 如何删除奇怪的蓝色下划线

<div class="line">─ ─ ─ ─ ─ ─ ─ ─ ─ 登入安全(至少要有一種安全判斷) ─ ─ ─ ─ ─ ─ ─ ─ ─</div>

.line { 
    text-align: center; 
    font-size: 15px; 
    color: #fc3f64; 
    font-weight: bold; 
    border: none; 
    text-decoraion:none; 
} 
.line:hover { 
    text-decoraion:none; 
}

此问题是[离题（＃1）]（/ help/on-topic）bec因为它不包含[mcve]。与外部网站的链接并不合适，因为它们可能会改变将这个问题提供给未来的访问者。 – zzzzBov

我刚刚找到一个不错的网站，http://csslint.net/，当你喂你的CSS说：'未知属性'文本decoraion'''两次。你错过了't'。 –

此外，看着有问题的网站，你有无效的标记，用一个''元素来包装你的所有内容。将鼠标悬停在该页面上的任何内容上都会触发'' – zzzzBov

答

有一个错字：

<a href="#" class="btn btn-default">全部欄位<a>

您应该关闭标签：

<a href="#" class="btn btn-default">全部欄位</a>

请考虑编码时，因为有其他未关闭标签和问题在代码中使用validator。

答

尝试

.line:active 
{ 
    text-decoration:none; 
}

答

发现问题，然后修复它：您的整个代码被包裹在标签内，导致每件事都被加下划线。

看到这个

https://drive.google.com/file/d/0BwIWuJmCDI1va0VRRWp4UThvS0k/view?usp=sharing

您可以删除这个<a>标签解决这个问题。或者使用下面的CSS来解决这个

a:hover, a:active{ 
    text-decoration:none !important; 
}

如果这不起作用使用a:hover *, a:active *也

答

检查你的代码后，你需要重写默认<a>标签，这为text-decoration: underline;。另外，我不确定您应该在<a>中包含您的表单。

a:hover, a:focus { 
    color: #158cba; 
    text-decoration: none; 
}

答

正如您在图片中看到的那样，在发生悬停时，a标签有一些默认值来自引导程序。所以，你可以通过向这个标签添加一个类来解决这个问题并且覆盖引导样式悬停。例如，如果您更改标签，并添加一个类，如：

<a class="overrideStyle">

，并在你的CSS：

.overrideStyle{ text-decoration: none; }

它会解决这个问题。

答

有在你的代码一个错字，变化

text-decoraion:none

到

{ 
text-decoration:none; 
}

，如果它不工作，使用更具体的查询选择，（给DIV 'id'会这样做）

如何删除奇怪的蓝色下划线

相关推荐