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

  • 0
    点赞
  • 0
    评论
  • 0
    收藏
  • 一键三连
    一键三连
  • 扫一扫,分享海报

表情包
插入表情
评论将由博主筛选后显示,对所有人可见 | 还能输入1000个字符
相关推荐
©️2020 CSDN 皮肤主题: 游动-白 设计师:白松林 返回首页
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值