美化表单的核心思想就是：隐藏原有的input标签！！！
代码一：改变单选的原有的颜色与边框
<style type="text/css">
input{
display: none;
} //隐藏原有的input
#wrap label:before{
display: inline-block;
content: "";
width:10px;
height:10px;
padding:3px;
border:1px solid red;
border-radius: 50%;
vertical-align: middle;
margin-right: 4px;
} //模拟单选框
input[type=radio]:checked+label:before{
background:red;
background-clip: content-box; //背景裁切
}
</style>
<div id="wrap">
<input type="radio" id="a" name="sex"/>
<label for="a">男</label>
<input type="radio" id="b" name="sex"/>
<label for="b">女</label>
</div>
代码二：改变复选框的勾勾的颜色
<style type="text/css">
input{
display: none;
} //隐藏原有的input
#wrap2 {
margin-top: 30px;
}
#wrap2 label:before{
display: inline-block;
content:"";
width:16px;
height:16px;
border:1px solid #000;
margin-right:10px;
border-radius: 4px;
vertical-align: middle;
} //模拟复选框
#wrap2 input[type=checkbox]:checked+label:before{
background:url(img/70.png) center no-repeat;
background-size: 12px;
} //选中的时候改变背景
</style>
<div id="wrap2">
<input type="checkbox" id="c"/>
<label for="c">同意开通空间</label>
</div>