如何检查是否用户通过JavaScript或CSS是在高对比度模式

Question

当按下移 + 左 + 替代 + 打印 Windows切换到高对比度模式 - 是否有任何机会（使用JavaScript或CSS）来检测在网页上？

是否有任何机会以检测在HTTP-Request（a.k.a服务器侧例如经由PHP或Ruby）？

Answer 1

根据在高对比度精灵，在Windows高对比度模式，背景图片应设置为“无”，它也改变了背景色。这应该覆盖任何CSS样式表。所以，你可以执行一些JavaScript渲染初期后检测到它。检查自己的演示页面（以下简称 “FYI [不]在高对比度模式” 文本）。

我的Mac（FYI切换使用Cmd + Alt + Ctrl + 8）和他的技术不适合我的工作，但他说，这适用于Windows。

如果一切正常，你既可以使用JavaScript来简单地改变你的CSS或设置（会话）的cookie并重新加载页面将它传递到服务器并进行服务器端的操作。

Answer 2

下面对我的作品上的Win8与（在桌面 - ）IE：

<style type="text/css">
// ...
@media screen and (-ms-high-contrast: active) {
   /* any rules may come here, for example: */
   .leftMenu a:hover { text-decoration: underline; }
}
// ...
</style>

我认为，它必须与Windows应用商店的应用程序正常工作。 这不是一个完整的解决方案，但也许有用位。

MSDN DOC： @media ， -MS-高对比度。 的高对比度模式描述也值得一提。

Answer 3

如果要实现在web应用高对比度然后使用以下，用于检测的黑上白和白上黑对比度选择代码块。这将很好地工作在IE中。

@media屏幕和（-MS-高对比度：黑上白色）{  / *  把你的样式代码.............   * /   }

@media屏幕和（-MS-高对比度：带白色黑底）{  / * 把你的样式代码............. * /   }