<label class="so_far"> <div class="so_far_check"> <input type="checkbox" class="weui-check"> <p class="suggest_round"> <svg t="1539140624347" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1588" xmlns:xlink="http://www.w3.org/1999/xlink"> <defs> <style type="text/css"></style> </defs> <path d="M816.408011 340.3015 816.408011 340.3015 467.230354 689.478134l0 0c-8.242731 8.240685-19.628036 13.338796-32.205493 13.338796-12.576433 0-23.962761-5.097088-32.203446-13.338796l0 0L205.460442 492.117161l0 0c-8.243755-8.240685-13.340843-19.628036-13.340843-32.204469 0-25.155936 20.390399-45.545312 45.544289-45.545312 12.577456 0 23.962761 5.097088 32.205493 13.340843l0 0 165.155481 165.153434 316.972165-316.969095 0 0c8.240685-8.243755 19.628036-13.340843 32.203446-13.340843 25.15389 0 45.544289 20.389376 45.544289 45.545312C829.745784 320.671417 824.649719 332.060815 816.408011 340.3015z" fill="#fff" p-id="1589"></path> </svg> </p> </div> <div class="so_far_txt">至今</div> </label>
.so_far { position: absolute; right: 0; top: 0; height: 100%; width: 1.5rem; } .so_far_check { margin-right: .1rem; display: inline-block; } .weui-check { position: absolute; left: -9999em; } .weui-check:checked+.suggest_round { background-color: #ff7561; border: none; } .suggest_round { display: inline-block; vertical-align: middle; background-color: #fff; width: .38rem; height: .38rem; line-height: .40rem; border: 1px solid #9a9a9a; border-radius: 50%; } .so_far_txt { display: inline-block; vertical-align: middle; } .so_far_check:checked+label:after { content: ""; position: absolute; left: 2px; top: 2px; width: 9px; height: 4px; border: 2px solid #424242; border-top-color: transparent; border-right-color: transparent; transform: rotate(-45deg); -ms-transform: rotate(-60deg); -moz-transform: rotate(-60deg); -webkit-transform: rotate(-60deg); }