我使用 .sr-only 是为了与 Lynx 等基于文本的浏览器兼容。例如,我在页眉上放了一个 ASCII 标志,所以如果有人使用标准的 GUI 浏览器(如 Firefox)浏览网站,它会显示正常的图形标志。否则,它显示 ASCII 文本标识。
但是在联系页面上,有一个 OpenStreetMap iframe。我也在那里放了一个 ASCII 映射,但是当我在 Lynx 中打开页面时,OSM 嵌入了一个长 URL 和错误消息。
这是我的问题:我想让 OSM 嵌入仅在使用屏幕阅读器/文本浏览器时可见。这就像反向 sr-only。
最佳答案
很晚了,不确定它是否会有帮助,但这就是我在隐藏缩写格式的同时向屏幕阅读器显示完整日期的方式,而对于有视力的人则相反
观众。
我使用 aria-hidden
在屏幕阅读器中隐藏了为有视力的观众准备的文本,并使用 aria-label
让屏幕阅读器查找和阅读:
<span aria-label="Beginning April 25 2017 until December 31 2035">
<span aria-hidden="true">2017/04/25 - 2035/12/31</span>
</span>
关于css - Bootstrap 4 中是否有类似 reverse sr-only 的东西?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49658736/