1

我已经成功地设置了 Metro 中单选按钮的标准外观

input[type=radio]::-ms-check { 
    border: none; 
    background: transparent url('myImage.png');
}

和活动状态

input[type=radio]::-ms-check:active { 
    border: none; 
    background: transparent url('myActiveImage.png');
}

但是我一辈子都无法弄清楚如何设置选中状态的样式。明显的选择不起作用：

input[type=radio]::-ms-check:checked {}
input[type=radio]:checked {}

这在 Metro 中是否可行？

更新：

input[type=radio]:checked::-ms-check {
    background: red;
}

... 用于更改背景颜色，但不会删除单选圆点。如果我想在背景中使用自己的图像，这就是我需要做的。点可以去掉吗？

4

1 回答 1

3

问题是您没有使用正确数量的冒号::-ms-check。它是一个伪元素，所以它有两个冒号。（与伪选择器相反，伪选择器有一个。）

你也有向后的顺序。您需要指定要使用单选按钮的::-ms-check伪元素，而不是获取伪元素然后尝试设置其版本的样式。:checked::-ms-check:checked

因此，以下应该有效：

input[type=radio]::-ms-check {
    background: orange;
}

input[type=radio]:checked::-ms-check {
    background: blue;
    color: red; // to remove it, `color: transparent`
}

现场演示（在 IE10 中查看）：http ://codepen.io/anon/pen/zAwyp

于 2012-11-06T00:22:57.610 回答