900字范文,内容丰富有趣,生活中的好帮手!
900字范文 > 修改 input checkbox(复选框) 选中的背景颜色 _@jie

修改 input checkbox(复选框) 选中的背景颜色 _@jie

时间:2019-09-10 17:39:41

相关推荐

修改 input checkbox(复选框) 选中的背景颜色 _@jie

在项目中遇到 修改 input选中后的背景颜色

实现效果如下图:
代码如下:

通过 after 伪类选择器 实现

<style>input[type=checkbox] {cursor: pointer;position: relative;width: 15px;height: 15px;font-size: 14px;}input[type=checkbox]::after {position: absolute;top: 0;color: #000;width: 15px;height: 15px;display: inline-block;visibility: visible;padding-left: 0px;text-align: center;content: ' ';border-radius: 3px}input[type=checkbox]:checked::after {content: "✓";color: #fff;font-size: 12px;font-weight: bold;background-color: #ff366f;}</style>

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。