IE8 图标像复选框

Question

我制作了类似复选框的图标，单击时会更改图标的颜色。它似乎适用于 Chrome、IE9+。但我需要让它们在 IE8 上工作（点击图标不会被更改）。

HTML

<input id="checkbox1" class="icon-checkbox" type="checkbox" />
<label for="checkbox1">
<span class='glyphicon glyphicon-trash unchecked'></span>
<span style='color:red;' class='glyphicon glyphicon-trash checked'></span>
</label>

CSS

input[type='checkbox'].icon-checkbox{display:none}
input[type='checkbox'].icon-checkbox+label .unchecked{display:inline}
input[type='checkbox'].icon-checkbox+label .checked{display:none}
input[type='checkbox']:checked.icon-checkbox{display:none}
input[type='checkbox']:checked.icon-checkbox+label .unchecked{display:none}
input[type='checkbox']:checked.icon-checkbox+label .checked{display:inline}

https://jsfiddle.net/tadasvu/DTcHh/14579/

P.S 我有：html5shiv.min.js,respond.min.js 包括在内。

Answer 1

如果您想要与旧版 IE 兼容，请不要使用兄弟选择器，直接调用类。这应该可以解决它。

IE8 图标像复选框

IE8 icon like checkboxes

css

internet-explorer-8

twitter-bootstrap-3