改变radio/checkbox默认样式

直接上代码

.item input[type="radio" ] {
        width: 20px;
        height: 20px;
        background: #fff;
        -webkit-appearance: none;
     -moz-appearance: none; border: 1px solid #999; } .item input[type="radio" ]:checked { background:url("../img/select.png"); background-size: cover; }

 得到的结果就是radio的样式由圆形改为了正方形,被选中打勾。

checkbox同理。

起重要作用的就是-webkit-appearance: none,-moz-appearance: none将默认样式清除,然后就可以自己需要设置了。

posted @ 2018-03-16 14:12  盲灯  阅读(934)  评论(0编辑  收藏  举报