css设置radio不显示小圈
<input type="radio" name="n" checked="checked"><span>选中变红</span>
默认情况下，input的type为radio时会显示小圆圈，去除的方法很简单，只需要设置 input{-webkit-appearance:none;} 即可。
设置了input{-webkit-appearance:none;} 后，input就会消失不可见，input也就失效了，我们可以设置它的width和height属性让它显示出来，同时设置它的background和border来进行美化。
（相关课程推荐：css视频教程）
<label for="r1">
<input type="radio" id="r1" name="n" checked="checked">radio1
</label>
<label for="r2">
<input type="radio" id="r2" name="n" checked="checked">radio2
</label>
<style>
input[type="radio"]{
-webkit-appearance:none;
width: 16px;
height: 16px;
background: pink;
border-radius: 10
border: 4px solid skyblue;
}
input[type="radio"]:checked{
background: #000;
}
input[type="radio"]:checked + span{
color: red;
}
</style>效果：
本文来自css3答疑栏目，欢迎学习！
以上就是css设置radio不显示小圈的详细内容，更多请关注易知道|edz.cc其它相关文章！
