按值css定位单选按钮

Question

我有一些HTML：

<input type="radio" value="red" id="color" name="attribute_color">
<input type="radio" value="blue" id="color" name="attribute_color">
<input type="radio" value="green" id="color" name="attribute_color">

如何在不添加任何ID或类的情况下定位不同的输入？我可以按值定位吗？

Answer 1

是的，你可以这样定义你的css规则：

input[value="red"] {
   /* style for red radio */
}

input[value="green"] {
   /* style for green radio */
}

input[value="blue"] {
   /* style for blue radio */
}

属性选择器适用于所有浏览器和IE7 +