button 黑边问题

黑边问题
黑边问题如上图，active状态下才有，很难看。
查看源码发现设置了outline和box-shadow 阴影。 box-shadow

去掉即可：

.btn:active,
.btn.active,
.btn:focus,
.btn:active:focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn.active.focus {
    outline: 0;
    box-shadow:none;
}

知识点：彻底弄懂 outline border box-shadow

outline border box-shadow三者的关系
outline 1px
outline: 1px outline-offset: 12px
outline 5px outline-offset: 12px
outline: 13px box-shadow: 0 0 55px 10px red
outline: 13px outline-offset: 12px box-shadow: 0 0 55px 10px red

由于outline-offset 属性的存在，outline和border，outline和 box-shadow均有可能重叠。