简体   繁体   English

在Bootstrap 4中是否有类似反向sr的东西?

[英]Is there anything like reverse sr-only in Bootstrap 4?

I'm using .sr-only for compatibility with text based browsers like Lynx. 我使用.sr-only与Lynx等基于文本的浏览器兼容。 For example, I put an ASCII logo on header, so if somebody browses the website with standart GUI browsers like Firefox, it shows the normal graphical logo. 例如,我在标题上放了一个ASCII标识,所以如果有人用Firefox之类的标准GUI浏览器浏览网站,它会显示正常的图形标识。 Else, it shows ASCII text logo. 否则,它显示ASCII文本标志。

But on the contact page, there is an OpenStreetMap iframe. 但在联系页面上,有一个OpenStreetMap iframe。 I put an ASCII map to there too, but when I opened the page in Lynx, OSM embed is there with a long URL and error messages. 我也在那里放了一张ASCII地图,但是当我在Lynx中打开页面时,OSM嵌入有一个很长的URL和错误消息。

This is my problem: I want to make OSM embed to be visible only if using a screen reader/text browser. 这是我的问题:我想只有在使用屏幕阅读器/文本浏览器时才能使OSM嵌入。 It's like reverse sr-only. 这就像反向sr-only。

Quite late, and not sure if it will help exactly, but this is how I show full dates to the screenreader while hiding the abbreviated format, and doing the opposite for sighted viewers. 很晚,并不确定它是否会有所帮助,但这就是我在隐藏缩写格式时向屏幕阅读器显示完整日期的方式,并为视力正常的观众做相反的事情。
I hide the text intended for sighted viewers from the screenreader with aria-hidden , and use aria-label for the screenreader to find and read: 我使用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>                    

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM