在导航类内的图像上悬停的Bootstrap奇怪边框

Question

我将这个奇怪的白色/灰色边框悬停在导航类中的图像上。

如何摆脱它？

这是代码

          <ul class="nav nav-pills">
            <li class = "list">
            <a href="#/events" class = "link"><img src = "images/Icon-Events.png" class = "nav-image"></a>
            <center><span class = "description">Events</span></center>
          </li>
         </ul>

Answer 1

这是.nav的悬停效果。

如果您不需要，可以删除.nav课程，或者只使用自己的CSS覆盖:hover样式。

Answer 2

找到了修复方法。将它贴在这里，以防它帮助某人。

在bootstrap css文件中（bootstrap.min.css或bootstrap.css，具体取决于你在应用中包含的内容）覆盖

.nav > li > a:hover,
.nav > li > a:focus {
   text-decoration: none;
   background-color: #eee;
}

与

.nav > li > a:hover,
.nav > li > a:focus {
   text-decoration: none;
}