::-ms-check

::-ms-check这个css伪类是微软扩展的用以表达 checkboxes 和 radio 的勾选状态，其中 checkboxes 和 radio分别通过 <input type="checkbox"> 和 <input type="radio">创建

只有IE浏览器和微软Edge浏览器支持该伪类。

属性支持性

只有以下css属性可以在选择器里使用 ::-ms-check 伪类. 其他属性会被自动忽略

• background-clip
• background-color
• background-image
• background-origin
• background-repeat
• background-size
• border-bottom-color
• border-bottom-left-radius
• border-bottom-right-radius
• border-bottom-style
• border-bottom-width
• border-left-color
• border-left-style
• border-left-width
• border-right-color
• border-right-style
• border-right-width
• border-top-color
• border-top-left-radius
• border-top-right-radius
• border-top-style
• border-top-width
• box-shadow
• box-sizing
• color
• cursor
• display (values block, inline-block, none)
• @font-face
• font-size
• font-style
• font-weight
• height
• margin-bottom
• margin-left
• margin-right
• margin-top
• -ms-background-position-x
• -ms-background-position-y
• -ms-high-contrast-adjust
• opacity
• outline-color
• outline-style
• outline-width
• padding-bottom
• padding-left
• padding-right
• padding-top
• transform
• transform-origin
• visibility
• width

语法

  ::-ms-check

例子

HTML

<form>
  <label for="redButton">Red</label>
  <input type="radio" id="redButton"><br>
  <label for="greenCheckbox">Green</label>
  <input type="checkbox" id="greenCheckbox">
</form>

CSS

input, label {
  display: inline;
}

input[type=radio]::-ms-check {
  border-color: red; /* This will make the border red when the button is checked. */
  color: red; /* This will make the circle red when the button is checked. */
}

input[type=checkbox]::-ms-check {
  border-color: green; /* This will make the box green when the button is checked. */
  color: green; /* This will make the checkmark green when the button is checked. */
}

结果

可以尝试下面的例子， 左边的截屏显示当用户不在ie浏览器或Edge浏览器上运行时勾选上按钮时的情况

Screenshot	Live sample

详述

无

浏览器兼容性