我有一个自定义引导按钮,点击后我无法删除它的边框。我能够改变它的背景颜色,但有一个坚持的蓝色边框让我感到厌烦。
我点击它,它会打开一个模态窗口,在关闭模态后,边框仍然存在,直到我点击页面的另一部分,即使我更改了:active
和:focus
中的值。
HTML :
<button id="openPopup" type="button" class="btn btn-primary btn-lg text-uppercase" data-toggle="modal" data-target="#myModal">
some text here
</button>
CSS :
#openPopup {
padding: 20px 30px;
background-color: #a2238e;
border-color: #a2238e;
box-shadow: 1px 1px 1px #999;
white-space: normal;
font-size: smaller;
letter-spacing: 0.2px;
}
#openPopup:hover, #openPopup:active, #openPopup:focus {
background-color: #912284 !important;
border-color: #912284 !important;
}
答案 0 :(得分:5)
在Bootstrap 4.5.0上,您可以尝试
<button class="btn btn-primary shadow-none">ADD TEXT HERE</button>
对我有用。
答案 1 :(得分:3)
<button type="button" class="btn btn-link">Link</button>
Bootstrap
答案 2 :(得分:0)
试试这个
#openPopup { outline:none; border-style: none; }
#openPopup:hover, #openPopup:active, #openPopup:focus { outline: none; border-style: none; }
答案 3 :(得分:0)
试试这个
#openPopup:focus {
outline: none;
}
或
#openPopup:focus {
outline: 0;
}
答案 4 :(得分:0)
在 Bootstrap 4.6.0 上你可以试试这个
#openPopup {
border: none;
box-shadow: none;
}
答案 5 :(得分:-1)
尝试删除边框:focus和:active
#openPopup:active, #openPopup:focus {
border-style: none !important;
}