我有以下CSS:
.mcRow input.mcCheckbox {
display:none;
}
.mcRow input.mcCheckbox + label {
background: url('/media/img/pt/dhtml/mc_off.gif') no-repeat;
height: 19px;
width: 19px;
display:inline-block;
padding: 0px;
padding-left: 20px;
width: auto;
}
.mcRow input.mcCheckbox:checked + label {
background: url('/media/img/pt/dhtml/mc_on.gif') no-repeat;
}
.mcRow input.mcCheckbox.checked + label {
background: url('/media/img/pt/dhtml/mc_on.gif') no-repeat;
}
由于 IE8 不能很好地与 CSS3 配合使用,我已经包含了一个使用 jQuery 切换的备用 .checked 类。我希望即使 JS 损坏也能显示我的自定义复选框,因此我想保留 CSS3 中包含的 :checked 伪选择器。
上面的顺序在 IE 8 中表现不佳。它似乎忽略了 :checked 语句之后的所有内容。
.mcRow input.mcCheckbox + label {
background: url('/media/img/pt/dhtml/mc_off.gif') no-repeat;
height: 19px;
width: 19px;
display:inline-block;
padding: 0px;
padding-left: 20px;
width: auto;
}
.mcRow input.mcCheckbox.checked + label {
background: url('/media/img/pt/dhtml/mc_on.gif') no-repeat;
}
.mcRow input.mcCheckbox:checked + label {
background: url('/media/img/pt/dhtml/mc_on.gif') no-repeat;
}
工作得很好。我害怕将它添加到文件中并且有人在此语句之后添加其他 CSS,不知道它不会在 IE8 中读取。:( 我应该怎么办?