用CSS改变“selected”的背景颜色

我试图改变所选项目的背景颜色，但无法让它工作。用CSS改变“selected”的背景颜色

HTML：

<table class="select_payment_method_table"> 
<tr> 
    <td class="payment_details_cc"> 
     <input id="visa1" type="radio" name="visa1" value="a1" checked="checked"/> 
     <span class="visa_card_img">&nbsp;&nbsp;Credit Card (VISA/MasterCard)</span> 
     <div class="clearfix"></div> 
     <div class="payment_img_main"><img src="image.png"></div> 
    </td> 
</tr>

我尝试这样做，但它不工作：

CSS：

.select input[checked] 
{ 
background-color:white; 
}

来源

2013-08-16 Teo

'.select'类在哪里？ - 如果你包含'

'（我假设你打算这么做）的完整类名，它的工作正常 - http://jsfiddle.net/KcEeW/1/ – Adrift

回答

如果您想选择的无线电元件本身，你可以这样做：如果你想选择旁边的单选元素的元素文本的背景

input[type="radio"]:checked { background-color: blue; }

，那么你可以使用这个：

如果你想要两者都要结合规则。希望有所帮助。

来源

2013-08-16 18:16:28

我检查了几次，但只有第二个工程。第一行不影响框的视图。我试图改变bg颜色，如果选择... – Teo

对不起，我在IE中测试它，它工作正常。它似乎不适用于更改单选按钮本身的FF背景颜色。看来没有任何建议的答案会在FF中起作用。您可能需要使用图像代替单选按钮。 –

这里是一个JSFiddle演示，您可以在IE和FF中尝试：http://jsfiddle.net/ADrhs/ –

你的语法是有点不对（假设你确实有一个.select类，因为它不在你的HTML中）：

.select input:checked 
{ 
    background-color:white; 
}

For further reading on :checked selector

来源

2013-08-16 18:13:36 Itay

checked也是一个属性，所以它也是（有点^^）正确。这是否会让它在IE8和IE7中工作？如果需要，还可以勾选'[checked]：checked''来获得更多的特异性。 – FelipeAls

我不认为人们应该特别支持IE 7。无论如何，对于IE 8，可以使用自定义JS或polyfills。这个线程也可能有帮助：[CSS3 - 在旧版浏览器上使用：checked选择器的样式无线电输入（ie7/ie8）]（http://stackoverflow.com/questions/7461756/css3-style-radio-inputs-using - 检查选择器在旧浏览器 - ie7-ie8） – Itay

input:checked 
{ 
    background:#ff0000; 
}

没有所谓的选择类。这种风格仅受Opera支持。

来源

2013-08-16 18:15:29

用CSS改变“selected”的背景颜色

回答

相关问题