如何更改 iOS 和安卓浏览器上的 input[type="radio"] 元素的默认样式？

可选框input[type="radio"] 在移动端的样式不一致，尤其在ios的样式别的惨目忍睹，所以就自己自定义一下，查了网上好多资源，不尽人意，都是一套代码反复发，所以自己写了一个～

写完是长这个样子滴

<span class="sex">
    <label>
        <img src="static/img/icon_ddown.png" v-show="this.Sex == 1"> //选中状态图片地址
        <img src="static/img/icon_weixz.png" v-else> //
	<input type="radio" name="sex" value="1" @click="sexChoose(1)">女
    </label>
</span>
<span class="sex">
    <label>
        <img src="static/img/icon_ddown.png" v-show="this.Sex == 0"> //选中状态图片地址
        <img src="static/img/icon_weixz.png" v-show="this.Sex == 1">
        <input type="radio" name="sex" value="0" @click="sexChoose(0)">男
    </label>
</span>

        .sex {
		float: left;
		width: 40%;
		height: 0.5rem;
		text-align: left;
		box-sizing: border-box;
		padding-left: 0.3rem;
	}
	.sex label{
		position: relative;
		padding-left: 0.26rem;
	}
	.sex input {
		width: 0.15rem; height: 0.15rem;
		position: absolute; top: 0.03rem;
		left: 0;
		margin-right: 0.1rem;
		background: initial;
		opacity: 0;
	}
	.sex img {
		width: 0.15rem; height: 0.15rem;
		position: absolute; top: 0.03rem;
		left: 0;
		margin-right: 0.1rem;
		background: initial;
	}

export default{
data (){
    return {
	Sex: 1,
    }
},
methods: {
    /**
     * [sexChoose 性别选择]
     * @param  {[type]} val [description]
     * @return {[type]}     [description]
    */
    sexChoose(val) {
        this.Sex = val;
    },
}
}

这两个就是我用的选中图片～～