Bootstrap Scrollspy：删除框突出显示。只有文字答案

【问题标题】：Bootstrap Scrollspy: Remove Box Highlighting. Only TextBootstrap Scrollspy：删除框突出显示。只有文字
【发布时间】：2018-04-14 07:17:13
【问题描述】：

（我在这个上使用 bootstrap 3.3.7）

嗨。我想对我的引导导航栏产生影响，即在用户所在的任何部分（我在我的单页网站上使用标签），导航栏中的文本只需滚动就会自动突出显示。我已经设置了放置锚链接...

因此，有了 body 标签的附加属性，到目前为止它工作得很好

<body data-spy="scroll" data-target=".navbar-collapse">

...但是有一个问题。我只希望导航栏中的文本看起来很活跃，突出显示。但正如您在图片上看到的（上图），现在在突出显示的导航栏链接周围有一个类似的框。它不知从何而来。我怎样才能摆脱它，所以只有文本颜色在它处于活动状态时会变浅一点？ Look on the image here. The upper example is the problem now, and the bottom one is how I would like it, but with using scrollspy. So not that black box.

提前向我的朋友们打招呼和感谢

【问题讨论】：

标签： html css twitter-bootstrap navbar scrollspy

【解决方案1】：

您需要将<a> 标记的活动状态更改为无背景。当您使用 scrollspy 滚动时，Bootstrap 会将 active 类添加到包含链接的li。所以它会是这样的：

.navbar-inverse .navbar-nav > .active > a,
.navbar-inverse .navbar-nav > .active > a:hover,
.navbar-inverse .navbar-nav > .active > a:focus{
  background:none;
}

在上面的示例中，我还包括了悬停和焦点状态，但如果您想更改这些状态，您也可以通过图像中的颜色自行更改，我假设您使用的是 navbar-inverse，如果您正在使用像navbar-default 这样的其他东西，你必须相应地改变它。

【讨论】：

嘿，非常感谢您的回答，它帮助了我。因为我是一个非常初学者，所以我有点难以理解你的意思，你在哪里实现了你给我的部分代码。但我有一个可行的解决方案；在所有 a 标签（nav > div > div > ul > li >）中，我必须添加 style="background:none"... 所以我也尝试不这样做内联 CSS，并给 a 标签一个类，或应用背景：所有“a”元素都没有，但这不起作用，我不知道为什么。所以它在代码混乱中产生了更多的代码，但我得到了一个很好的工作解决方案。你能告诉我你所说的a:hover/focus是什么意思吗？