需要两个label,第一个label配合input,第2个label才是input的内容
HTML:
<input checked type="radio" id="radio-1" name="radio-1-set" class="regular-radio"/> <label for="radio-1"></label> <label class="inputlabel" for="radio-1">微信支付</label> CSS: .regular-radio { display: none; } .regular-radio + label { -webkit-appearance: none; background-color: RGB(248,248,249); padding: 9px; border-radius: 50px; /*padding: .09rem; border-radius: .5rem;*/ display: inline-block; position: relative; } .regular-radio:checked + label:after { content: ' '; width: 12px; height: 12px; border-radius: 50px; position: absolute; top: 3px; background: #E72F17; text-shadow: 0px; left: 3px; font-size: 32px; } .regular-radio:checked + label { background-color: #e9ecee; }