如何解决纯CSS复选框图像替换
您已经关闭了。只需确保隐藏复选框，然后将其与您通过样式设置的标签相关联即可input[checkbox] + label
解决方法
我在表中有一个复选框列表。（该行中的多个CB之一）
<tr><td><input type="checkbox" class="custom_image" value="1" id="CB1" /><label for='CB1'> </label></td></tr>
<tr><td><input type="checkbox" class="custom_image" value="2" id="CB2" /><label for='CB2'> </label></td></tr>
<tr><td><input type="checkbox" class="custom_image" value="3" id="CB3" /><label for='CB3'> </label></td></tr>
<tr><td><input type="checkbox" class="custom_image" value="4" id="CB4" /><label for='CB4'> </label></td></tr>
我想用一对自定义的开/关图像替换复选框图像，我想知道是否有人对如何使用CSS更好地了解？
我已经找到了这个“ CSS ninja”教程，但是我不得不承认发现它对我来说有点复杂。
据我所知，您可以使用伪类
td:not(#foo) > input[type=checkbox] + label
{
background: url('/images/off.png') 0 0px no-repeat;
height: 16px;
padding: 0 0 0 0px;
}
我的期望是，通过添加上述CSS，该复选框至少将默认显示为处于OFF状态的图像，然后添加以下内容以使ON
td:not(#foo) > input[type=checkbox]:checked + label {
background: url('/images/on.png') 0 0px no-repeat;
}
不幸的是，似乎我在某处缺少关键步骤。我尝试使用自定义CSS3选择器语法来匹配我当前的设置-但必须丢失一些内容（如果这很重要，则图像尺寸为16x16）
编辑：我在本教程中丢失了一些内容，在该内容中，他将图像更改应用于标签而不是输入本身。我仍然没有在页面上得到复选框结果的预期交换图像，但是我想离得更近了。
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。