自定义刻度未显示在边缘/即复选框上

Question

我已经尝试过几次尝试使刻度线与其他浏览器相同，但是对于Edge来说却从未如此。这是我的小提琴： http://jsfiddle.net/skb643ez/

这是我的HTML的结构：

<p>
Test
<a href="/somewhere">Somewhere (link)</a>
</p>
<input type="checkbox" id="test"><label for="test">Test label</label>
<p>
 Test
<a href="/somewhere">Somewhere (link)</a>
</p>

chrome上的图像是这样的

同时在Edge上

我尝试了ms-checked或ms-expand不显示任何内容，但这没有任何作用。我认为这是因为webkit外观不起作用。有没有不使用js或jquery的解决方案？谢谢

Answer 1

我找到了答案，我们将::-ms-checked的背景和边框颜色设置为透明。 https://jsfiddle.net/ycbvz4tl

input[type=checkbox]:checked {
   background-color: transparent;
   border-color: transparent;
   color: white;
}