<html>
<body>
<style>
.div1 input[type="checkbox"]{
-webkit-appearance:none;
appearance:none;
width:50px;
height:50px;
background: #999;
border:1px solid #999;
border-radius: 30px;
outline: none;
}
.div1 input[type="checkbox"]:checked{
background: #4f86ea;
}
</style>
<div class="div1">
<input type="checkbox">
</div>
<body>
</html>
input checked checkbox 样式改写---常规选择
最后编辑于 :
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
推荐阅读更多精彩内容
- (楼主亲测: Chrome&Safari&UC 中可行,fire&IE 不可行。所以如果你在考虑各种浏览器的兼容性...
- 最终的效果图 image.png 使用到的方法 :before 伪元素,html 转义字符 参考地址 less 源...
- 1.1、纯css通过伪元素来定义input输入框激活样式 HTML代码: CSS伪元素实现代码: 注:1、加号为相...