html 按钮去掉阴影效果,HTML – 删除按钮阴影

你错过了这个：

.btn.active.focus, .btn.active:focus, .btn.focus, .btn.focus:active, .btn:active:focus, .btn:focus {

outline: thin dotted;

outline-offset: -2px;

}

所以你需要重置它. (！重要仅用于演示 – 请勿在开发代码中使用)

片段

.container-fluid {

text-align: center;

}

body .btn {

height: 170px;

width: 170px;

border-radius: 50% !important;

outline: 0 !important;

}

.btn.active.focus,

.btn.active:focus,

.btn.focus,

.btn.focus:active,

.btn:active:focus,

.btn:focus {

outline: 0 !important;

outline-offset: 0 !important;

background-image: none !important;

-webkit-box-shadow: none !important;

box-shadow: none !important;

}

result

Rock

Paper

Scissors