how to style checkbox like a radio button in IE

2019-08-03 17:47发布

问题:

I know it sounds wired. Currently I have multiple checkboxs I want to make it looks like radio button

following CSS not working in IE

input[type='checkbox'] {
-webkit-appearance: radio; /* Chrome, Safari, Opera */
-moz-appearance: radio;    /* Firefox */
appearance: radio;   //how about IE>8 ?
}

回答1:

The appearance property is not supported in Internet Explorer. You would need to instead target the pseudo element ::-ms-check and affect its presentation, and even this will only get you part-way:

::-ms-check {
  border-radius: 50%;
}

As Spudley stated in the comments above, this is a bad idea. Radio buttons and checkboxes function in distinctly different ways, and users have been taught to distinguish between the two.