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，它也适用于谷歌

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">

单选按钮css和IE9

1 个答案: