html - 单选按钮 css 和 IE9

Question

您好我一直在尝试使用自定义单选按钮，以下是我的 CSS。我已经用两个浏览器 IE9 和 Google chrome 在 google chrome 上对其进行了检查，但在 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 它也只能在谷歌上正常工作

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

Answer 1

尝试向单选按钮添加classorid属性并在 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">