引导崩溃文本装饰

Question

对于bootstrap塌陷组件，我有一个有关"审计示例"的问题。我希望在使用时从1-3的文本"可折叠组项目"中删除下划线。默认情况下，它们不是下划线的，然后在慕斯过后，它们会被下划线。这是可以通过以下方式修改的：

btn-link:{
text-decoration: none;
}

但是，在单击并将鼠标移开后，下划线持续到直到单击其他东西为止。我如何删除下划线？检查链接以查看我正在谈论的行为。

Answer 1

只需为btn-link

添加鼠标悬停

.btn-link:hover, .btn-link, .btn-link:focus{
   text-decoration:none;
}

在此处检查演示

Answer 2

您需要添加两件事：

删除悬停下划线的添加：

.btn-link:hover{
  text-decoration:none;
}

和在单击添加后进行下划线：

.btn-link:focus{
  text-decoration:none;
}

查看此示例。

Answer 3

您需要为此添加两种样式

.btn-link.focus, .btn-link:focus {
  text-decoration: none; //here is if you want to remove 
  box-shadow: none;
 }

和这个

.btn-link:hover{
  text-decoration:none; //here is if you want to remove 
 }

Answer 4

这个问题似乎是因为伪类:focus您可以这样覆盖:focus的CSS。

.btn-link.focus, .btn-link:focus {
    text-decoration: none;
}

我希望这能解决这个问题。

Answer 5

简单方法：只需添加!important

.btn-link {
  text-decoration:none !important;
}

小提琴

，或者您可以使用:focus进行单击，而:hover进行盘旋，

.btn-link:focus, .btn-link:hover {
    text-decoration: none;
}