css - 为单个输入 ID 定义 CSS 样式，而不是 input[type=checkbox]

Question

这是我的复选框

<input type="checkbox" name="MyName[]" value="A1" id="A1"/>
<label for="Filter"></label>
<input type="checkbox" name="MyName[]" value="A2" id="A2"/>
<label for="Filter"></label>

这是我的风格

input[type=checkbox] {..}
input[type=checkbox] + label {background:'image-1'}
input[type=checkbox]:checked + label {background:'image-2'}

我需要使用不同的选中和未选中图像来设置每个复选框的样式。

我想input[type=checkbox]在我的CSS中引用ID而不是。

怎么做？

Answer 1

input#A1
input#A2
input#A1:checked
input#A2:checked

input但如果您不想要，则无需指定标签名称 ( )。但它可能很有用！（尤其是类）

在文档中阅读有关 (ID-) 选择器的更多信息。

Answer 2

为了

<input type="checkbox" name="MyName[]" value="A1" id="A1"/>

这将是

input[name=MyName[]] {..}

满足您的需求

Answer 3

使用id 选择器： #

input#A1 {background:url('image-1.jpg');}
input#A1:checked {background:url('image-1-checked.jpg');}
input#A2 {background:url('image-2.jpg');}