<input type="radio" name="isSponsor" class="activity-radio">
<input type="radio" name="isSponsor" class="activity-radio">
.activity-radio {
width: 20px;
height: 0px;
background-color: #777;
margin-right: 30px;
border-radius: 50%;
position: relative;
}
.activity-radio:before,.activity-radio:after {
content: '';
display: block;
position: absolute;
border-radius: 50%;
transition: .3s ease;
}
.activity-radio:before {
top: 0px;
left: 0px;
width: 18px;
height: 18px;
background-color: #fff;
border: 1px solid #777;
}
.activity-radio:after {
top: 6px;
left: 6px;
width: 8px;
height: 8px;
background-color: #fff;
}
.activity-radio:checked:after {
top: 3px;
left: 3px;
width: 12px;
height: 12px;
background-color:#FFBA3C;
}
.activity-radio:checked:before {
border-color:#FFBA3C;
}
如图:
原文 https://blog.csdn.net/promisecao/article/details/54029848