用label，例如：
.add_cart_radio{float:left
margin-top:0.5em
margin-right:0.5em
}
.add_cart_radio input[type="radio"]{
display:none
}
.add_cart_radio input[type="radio"] + label{
padding:0.2em 1em
border:1px solid #CCCCCC
border-radius:0.5em
color:#999
}
.add_cart_radio input[type="radio"]:checked + label{
padding:0.2em 1em
border:1px solid #FF6600
border-radius:0.5em
background:#FF6600
color:#FFFFFF
}
radio单选按钮默认样式改变,radio默认样式确实有点丑,而且不能适合所有的UI设计稿,现在UI稿的花样是越来越多了,所有使用css自定义radio单选按钮样式还是很重要的.
在不使用js的情况下就改变了radio的按钮样式了,既然是自定义样式,就可以随心情自己修改了,我这里实现的效果是这样的
如果仅是在IE6的话：<style type="text/css">
input{border:1px #ff0000 solid}
input{border-color:expression((this.type=="text")?"#ff9966":"#ff0000")}
</style>
<input name="123" type="text">
<input type="radio" name="radiobutton">
