标签：分享 16px none type 通过 box hidden content str
通过选中时添加背景图片自定义CheckBox样式
效果：
CSS样式：
<style type="text/css>
label {
width: 10%;
display: flex;
display: -webkit-flex;
display: -moz-flex;
flex-direction: row;
justify-content: center;
align-items: center;
}
label input[type=checkbox] {
width: 15px;
height: 15px;
overflow: hidden;
background: #fff;
appearance: none;
-webkit-appearance: none;
border: 1px solid #808080;
outline: none;
margin-right: 5px;
margin-top: 0;
}
input[type=checkbox]:checked {
appearance: none;
-webkit-appearance: none;
background-image: url(./Images/btn-blue_03.png);
background-position: center;
background-repeat: no-repeat;
background-size: 100%;
border-radius: 4px;
border: 0;
overflow: hidden;
}
</style>
<body> <label> <input type="checkbox" name="type" checked> <span>one</span> </label> <label> <input type="checkbox" name="type"> <span>two</span> </label> </body>
标签：分享 16px none type 通过 box hidden content str
原文地址：https://www.cnblogs.com/qianxuebing/p/9829309.html
