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

Question

正如我在标题中提到的那样，我无法找到错误的内容，而且我甚至不知道为什么指针悬停时会出现蓝线。
演示：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;
}

Answer 1

尝试

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

Answer 2

有一个拼写错误：

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

你应该关闭一个标签：

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

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

Answer 3

找到问题然后修复它： 您的整个代码都包含在标记内部，这会导致每个内容都加下划线。

见这个

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

您可以删除此<a>标记修复此问题。或使用以下CSS来解决此问题

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

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

Answer 4

检查代码后，您需要覆盖默认的<a>标记，该标记为text-decoration: underline;。另外，我不确定您是否应该在<a>中包含您的表单。

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

Answer 5

正如您在图片中看到的那样，a标签在发生悬停时会从引导程序中获得一些defualt值。因此，您可以通过向此标记添加类并覆盖引导样式悬停来解决此问题。例如，如果您更改了标记并添加了类：

<a class="overrideStyle"> 

并在你的CSS中：

 .overrideStyle{ text-decoration: none; }

它将解决问题。

Answer 6

您的代码中有拼写错误， 改变

text-decoraion:none

到

 {
text-decoration:none;
}

如果它不起作用，请使用更具体的查询选择器（给div一个＆＃39; id＆＃39;会这样做）