我正在使用引导按钮类，更具体地说，如下：
<button type="button" class="btn btn-success navbar-btn">Login</button>
现在，颜色显示为绿色，这很好。每次我单击该按钮时，该按钮都会变成深绿色。我想要的是使按钮不会改变颜色，而只是保留默认的引导颜色，并且删除其周围的蓝色轮廓。
对于蓝色轮廓，我尝试将轮廓设置为无，但由于某种原因它不起作用。我知道我们必须使用
.btn : active:focus {
}
但我不知道引导成功按钮的默认颜色，所以我很难弄清楚。
默认颜色为btn-success is #5cb85c。您所要做的就是使用 DevTools 检查它或搜索引导样式表以查找与此类相关的所有规则，并更改您自己的样式表中所需的任何内容以覆盖它们。无需使用!important无论如何，特异性是你的朋友。看MDN 特异性 https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity.
请参阅工作片段（此示例将所有状态更改为相同的基色，作为示例，并且还删除了 box-shadow 属性。您应该能够从这里更改您需要的任何内容。）
.btn.btn-success {
color: #fff;
background-color: #5cb85c;
border-color: #5cb85c;
}
.btn.btn-success.focus,
.btn.btn-success:focus {
color: #fff;
background-color: #5cb85c;
border-color: #5cb85c;
outline: none;
box-shadow: none;
}
.btn.btn-success:hover {
color: #fff;
background-color: #5cb85c;
border-color: #5cb85c;
outline: none;
box-shadow: none;
}
.btn.btn-success.active,
.btn.btn-success:active {
color: #fff;
background-color: #5cb85c;
border-color: #5cb85c;
outline: none;
}
.btn.btn-success.active.focus,
.btn.btn-success.active:focus,
.btn.btn-success.active:hover,
.btn.btn-success:active.focus,
.btn.btn-success:active:focus,
.btn.btn-success:active:hover {
color: #fff;
background-color: #5cb85c;
border-color: #5cb85c;
outline: none;
box-shadow: none;
}
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" />
<nav class="navbar navbar-default">
<div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand" href="#">Brand</a>
<button type="button" class="btn btn-success navbar-btn">Changed BTN</button>
<button type="button" class="btn btn-info navbar-btn">Default BTN</button>
</div>
</div>
</nav>
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
