单选按钮 css 和 IE9

Question

您好，我一直在尝试使用自定义单选按钮，以下是我的 css。我已经用两个浏览器 IE9 和谷歌浏览器在谷歌浏览器上对其进行了检查，但在 ie9 上我提到的单选按钮图像没有显示请让我知道如何修复以下 css，以便它也可以在 ie9 上运行

input[type="radio"] {
background:url('images/radio_Checked.jpg');
padding:0;
width:10px;
height:10px;
display: inline-block;
appearance:none;
-moz-appearance:none;
-webkit-appearance:none;
vertical-align:middle;
}
input[type="radio"]:checked  {
background:url('images/radio_Unchecked_Small.jpg');

}

还尝试了以下 css，它也只能在 google 上正常工作

input[type="radio"]:checked
{
 -khtml-appearance: none;
 background: url('images/radio_Checked.jpg');
 width: 10px;
 height: 10px;
 }

Answer 1

尝试将class 或id 属性添加到您的单选按钮并在您的CSS 文件中为它们设置样式

.styled
{

background: url('test.jpg');

}

#styled
{
background: url('test.jpg');
}

HTML：

<input type="radio" name="radio" class="styled">

<input type="radio" name="radio" id="styled">