Internet Explorer 10 及更高版本中的高對比度模式

Created: November-22, 2018

在 Internet Explorer 10+和 Edge 中，Microsoft 提供 -ms-high-contrast 媒體選擇器以從瀏覽器中顯示高對比度設定，這允許程式設計師相應地調整其站點的樣式。

-ms-high-contrast 選擇器有 3 種狀態：active，black-on-white 和 white-on-black。在 IE10 +中它也有一個 none 狀態，但 Edge 不再支援它。

例子

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: black-on-white) {
   .header{
      background: #fff;
      color: #000;
   }
}

當高對比度模式處於活動狀態且處於 black-on-white 模式時，這會將標題背景更改為白色並將文字顏色更改為黑色。

@media screen and (-ms-high-contrast: white-on-black) {
   .header{
      background: #000;
      color: #fff;
   }
}

與第一個示例類似，但這只是專門選擇 white-on-black 狀態，並將標題顏色反轉為帶有白色文字的黑色背景。