自定义checkbox,radio样式

input[type=radio] {
margin-right: 5px;
cursor: pointer;
font-size: 14px;
width: 15px;
height: 15px;
position: relative;
-webkit-appearance: none;
appearance: none;
outline: none;
border: 0;
}
input[type=radio]:focus {
outline: none;
}
input[type=radio]:after {
position: absolute;
width: 16px;
height: 16px;
top: 0;
content: " ";
color: #fff;
display: inline-block;
visibility: visible;
padding: 0px 2px;
border-radius: 50%;
line-height: 16px;
background:#FFFFFF;
border:1px solid #DDDDDD;
}

input[type=radio]:checked:after {
 background:url('./checked.png') no-repeat center;

background-size: cover;
  outline: none;
border: 0;
}
posted @ 2019-06-21 16:54  WXUECHAO  阅读(170)  评论(0编辑  收藏  举报