问题标签 [high-contrast]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
1738 浏览

css - 如何处理禁用按钮上的颜色对比度可访问性问题

有一个按钮有条件地被禁用,并且被禁用的按钮是灰色的。


背景颜色为 #e0e0e0,文本颜色为#a6a6a6,因此对比度为 1.84,要求为 4.5。我想知道是否有任何方法可以跳过禁用按钮上的颜色对比度检查。


它现在已经拥有aria-disabled财产。

0 投票
4 回答
1196 浏览

javascript - 如何以编程方式启用“-ms-high-contrast”媒体查询?

我想在我的网站上启用高对比度模式,并将所有与可访问性相关的规则放在高对比度媒体查询中:

但是,如何以编程方式在 JavaScript 中启用这种模式?我想为我的用户提供一个按钮,让他们根据自己的意愿切换此功能。有没有可能?我做对了吗?也许存在更好的解决方案。

谢谢您的帮助。

0 投票
1 回答
204 浏览

accessibility - 为网站构建“高对比度”模式以满足可访问性标准?

我一直在研究一些具有漂亮调色板但没有提供足够高的文本和背景对比度以供可访问性的网站。我喜欢让网站对每个人都可用,但作为一名设计师,我对这么多令人敬畏的颜色组合完全不在桌面上感到沮丧。提供一种明显的方式来切换到高对比度模式是一种可接受的选择吗?

0 投票
1 回答
36 浏览

input - 所需的指标是否总是必须是红色的并且在 Web 表单上的标签级别?

我们的设计系统团队正在研究使我们的应用程序符合 WCAG 标准。今天,对于必填字段,我们输入中有一个橙色星号,表示该字段未完成的时间,一旦在该字段中输入条目,该星号就会消失。长期以来,它对我们的用户群都非常有效。

我们目前使用的橙色没有足够的对比度,必须改变。在调查我们如何解决这个问题的过程中,团队坚持 WCAG 要求所需的指标处于标签级别而不是输入级别,并且必须是红色的。

这是准确的吗?

0 投票
0 回答
379 浏览

visual-studio-code - Visual Studio Code 在高对比度主题中选择文本颜色

在 Visual Studio Code 中选择时,文本颜色变为黑色。

所选文本为蓝底黑字

这只发生在高对比度主题中。

虽然我可以更改 和 中的颜色settings.jsoneditor.selectionForeground但我想要的是保留原始颜色。

我怎样才能做到这一点?

0 投票
1 回答
727 浏览

xaml - 如何在 UWP 中为 HighContrast 主题设置 TextBlock 背景颜色

在 Microsoft UWP 应用程序中,我尝试使用 XAML 中的 Grid 设置 TextBlock 背景颜色。默认主题没问题。但是当我启用高对比度主题时,只有填充文本部分是黑色的;而 TextBlock 的剩余部分则根据 HighContrast Theme 进行更改。我也尝试过使用 Border,但问题仍然存在。我也尝试了 Style 属性,同样的问题。

谁能帮我解决这个问题?

如果您想要清晰的视野,请检查输出图像

与系统行为比较

0 投票
1 回答
59 浏览

xaml - 在图像文件名中使用限定符在 UWP 运行时不起作用

我试图在 UWP 应用程序中更改 Theme/HighContrast 更改的图像。我点击了链接:定制资源 但是当我在应用程序运行时更改主题时它不起作用。它在应用程序重新启动后工作。我同时遵循了文件夹名称限定符和文件名限定符。我需要做任何额外的改变吗?谁能帮帮我吗?

0 投票
1 回答
214 浏览

swift - 随着设备上增加的对比度设置,图标看起来有所不同

我的应用中有一个图标,在模拟器上看起来不错,但在我的设备上却错了;它有点“苍白”。我花了将近一个月的时间才弄清楚原因,原因是设置增加了图像的对比度。您可以在此处的设置中找到它: Settings-> Accessability-> Display & Text Size-> Increase Contrast-switch。

我的应用程序中有几个图标,但据我所知,只有一个受此影响。

我的问题:有什么办法可以忽略这个,让图标看起来总是正确的?

图标为黑色并默认呈现

0 投票
0 回答
57 浏览

frontend - 虽然不需要高对比度模式(括号预览)

您好,提前感谢您的帮助...我一直在网站上工作,最近在该网站上添加了一些 jquery(我不确定这是否是我的问题的原因),尽管我觉得值得指出在我添加 jquery 之前没有遇到问题......我还使用 gimp 为我的背景图像添加了渐变。当我单击实时预览时,我正在使用 Adob​​e Brackets 开发此站点。该站点现在显示为“高对比度模式”。我从来没有选择这个。我确信它与我的代码或添加了渐变的背景图像有关,而不是与任何括号或 Chrome 设置有关...这是因为当我预览同一站点的早期版本(pre-jquery/gradient)时,它们不会显示在“高对比度”模式下...我对此不是 100% 确定...在 o 之前我错了。

谢谢...这是我的代码...

索引.html:

播放器.html

样式.css:

主.js:

我也下载了“jquery-3.5.1.js”并将其添加到该网站......

所以再次感谢您查看帖子。并感谢您的帮助。

0 投票
1 回答
725 浏览

javascript - 如何让 Chrome 在 React 应用程序中使用 javascript/typescript 响应 Windows 10 高对比度模式

我正在寻找一种简单的方法来检测用户的系统是否处于高对比度模式或没有在反应应用程序中使用 javascript/typescript。

某处的图书馆中是否有可用的公共方法?

这些stackoverflow帖子没有给我我正在寻找的东西,这是一种导入方法:

检测是否在 Android 辅助功能设置中启用了“高对比度”

如何在 JavaScript / CSS 中检测 MAC OS 反色模式?

如何检测用户是否启用了 Mac OS 高对比度辅助功能设置?

编辑:我打算能够区分黑白模式和黑白模式

编辑:这是我尝试过的,但没有在 Chrome 中应用