修改手機端radio 樣式

標籤：http   log   black   width   alt   images   res   style   技術   

實現手機端radio樣式修改

http://www.iconfont.cn/搜尋對勾圖片和圓圈圖,分別命名為radio.png 和 select.png

填寫自己要的顏色，點擊下載png，一般人都會

   <span class="address-radio checked"></span>    <input type="radio" name="address" class="hide">

 　　　.address-radio {            display: block;            width: 2rem;            height: 2rem;            margin: 0 auto;            background: url(../../assets/images/radio.png) no-repeat 0px 1px;            background-size: 100% 100%        }        .address-radio.checked {            background: url(../../assets/images/select.png) no-repeat 0px 1px;            background-size: 100% 100%        } 　　　　.hide {        display:hidden        }

$(".address-radio").click(function () {        $(".address-radio").removeClass("checked");        $(this).toggleClass("checked");        $(this).next().prop(‘checked‘, ‘true‘);    });

代碼很簡單

 

修改手機端radio 樣式