改写radio样式

<div class="test">

　　<input type="radio" name="radioHouse" class="radio" id="big">

　　<label for="big">大床房</label>

</div>

<div class="test">

　　<input type="radio" name="radioHouse" class="radio" id="small">

　　<label for="small">小床房</label>

</div>

 

.radio{

　　position: absolute;  //隐藏label标签原本的样式

　　clip: rect(0, 0, 0, 0);

}

.radio:checked + label::before{

　　content: "\a0";

　　display: inline-block;

　　width:0.25rem;

　　height:0.25rem;

　　border-radius: 50%;

　　opacity:0.9;

　　border:0.05rem solid #55D8C2;

　　background-clip: content-box;

　　background-color: #01cd78;

　　padding: .2em;

}

.radio + label::before{

　　content: "\a0";

　　display: inline-block;

　　width:0.55rem;

　　height:0.55rem;

　　border-radius: 50%;

　　opacity:0.9;

　　border:0.05rem solid #999;

　　text-indent: .15em;

　　line-height: 0.5rem;

　　margin-right: .4em;

　　vertical-align: middle;

}