Firefox无法识别Checkbox的背景图像

Question

我已将图片作为复选框的背景。 Chrome中的一切工作正常但是当我使用Firefox 32.0.3时，firefox无法识别背景图像。是否有一些我错过的导致firefox无法添加到背景图像中？

CSS

input[type=checkbox]:before {
  content: "";
  display: inline-block;
  width: 12px;
  height: 12px;
  background-image: url('http://www.jpl.nasa.gov/spaceimages/images/mediumsize/PIA17011_ip.jpg');
  background-size: 12px;
  top: 2px;
  position: absolute;
  opacity:0.4;
}

HTML

<input type="checkbox" id="chk1" />

小提琴here。

Answer 1

我通过不同的方法解决了这个问题。我创建了一个span标签和AngularJS（已经在我的应用程序中）我使用ng-class根据是否标记了复选框将背景图像显示到span标签。