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

Question

我曾多次尝试使滴答声与其他浏览器相同，但对于 edge 来说却不一样。这是我的 fiddle : 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上的图片是这样的

同时在边缘

我试过 ms-checked 或 ms-expand display none，但这没有任何作用。我认为这是因为 webkit-appearance 不起作用。有没有不使用js或jquery的解决方案？谢谢

Answer 1

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

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