Twitter bootstrap 为什么Bootstrap'；s文本装饰：无不工作？

问题：

为什么引导程序不删除带有

文本装饰的超链接下划线：none

细分：

默认情况下，Bootstrap提供所有超链接

文本装饰：none

，具有低特定性CSS:

a {
  text-decoration: none;
}

但是，这实际上并不会从超链接中删除默认下划线：

（通过引导）

我假设您在链接上方悬停时指的是下划线，因为这是唯一似乎不起作用的东西

答案很简单：您的目标不是悬停状态。对于键盘导航，通常也建议处理焦点状态。试试这个

a, a:hover, a:focus {
    text-decoration: none;
}

---

不管你怎么说，在你的项目中有一个CSS规则覆盖了引导的

文本装饰：none

。演示代码中的链接运行正常

这可能是您的浏览器设置 如果在不同的浏览器上加载页面可以解决问题，那么情况就是这样。一些浏览器允许用户覆盖特定的CSS样式

它可能是另一个CSS文件

---

在谷歌浏览器上加载页面。右键单击链接，然后单击“检查元素”。您将看到所有有效的CSS规则，包括一个阻止引导

文本装饰：none

工作的规则。

在当前Chrome中看不到任何下划线。似乎只有在：hover状态下才会加下划线。事实证明，引导中的悬停实际上应用了更高的特殊性<代码>文本装饰：下划线；来自

a:focus，a:hover

在

选项卡focus.less

，明显比

a

具有更高的特异性。正确；我最初没有意识到Bootstrap会在

a:focus，a:hover

（在

选项卡focus.less中）中自动应用
文本装饰：下划线。我应该发现这个。在声明中声明悬停状态确实解决了问题——这是正确的答案，几分钟后系统允许我将标记为已接受：）为了进一步澄清，覆盖默认引导样式的更正确方法是在引导样式之前包含您自己的variables.scs（或variables.less），然后将其编译为CSS，作为构建过程的一部分。在本例中，您可以将
$link hover decoration
变量设置为none，而不是下划线，如本节变量所示。