Css 引导自定义按钮边框仅在悬停时显示

我目前正在设计一个网页使用引导。我需要自定义按钮颜色，因此我设计了自己的按钮类，您可以在那里看到：

 .btn.btn-radio {
    background: #f3bb70;
    border-color: transparent;
    border-right-color: #684235;
}

.btn.btn-plus {
  background: #684235;
  border-color: transparent;
}

---

因为按钮组的颜色相同，所以我只想在右侧加一个边框，以显示分隔。但边框仅在鼠标位于按钮上方时显示（请参见）。为什么会这样？如何让它一直在那里？

Bootstrap在css中有这一行。这就产生了问题

.btn-group .btn+.btn, .btn-group .btn+.btn-group, .btn-group .btn-group+.btn, .btn-group .btn-group+.btn-group {
      margin-left: -1px;
 }

您可以使用此功能，但我不知道它是否会产生其他问题：

 .btn.btn-radio {
    background: #f3bb70;
    border-color: transparent;
    border-right-color: #684235;
    margin-left: 0!important;
 }

---

此问题与按钮的z索引有关，因此要解决此问题而不与边距混淆，您需要为所有按钮添加边框，然后删除第一个子左边框

.btn.btn-radio {
    background: #f3bb70;
    border-color: transparent;
    border-right-color: #684235;
    border-left-color: #684235;
}
.btn.btn-radio:first-child{
    border-left-color: transparent;
}

.btn.btn-plus {
    background: #684235;
    border-color: transparent;

}

---

您必须覆盖bootstrap.css文件中的

.btn

目前有

---

边框：1px实心透明因此您的边框无法正常显示
谢谢！如果我做对了，基本上两个边界都在同一个位置，所以一次只能显示一个边界？