为什么标签上的相对定位会使标签内容对VoiceOver屏幕阅读器不可见?

时间:2016-11-28 14:34:05

标签: html css voiceover

当您在表单中的标签上明确设置position:relative时,VoiceOver不会大声读出标签文本。我只测试过Chrome和VoiceOver,所以我不知道是否会出现其他屏幕阅读器/浏览器组合。可能只是一个奇怪的错误,因为屏幕阅读器为什么会关心定位风格并不明显。

<form>
        <fieldset>
            <legend>Label Position Quirk</legend>
            <input id="thing1" type="checkbox">
            <label for="thing1" style="position:relative">This won't be read</label>
            <input id="thing2" type="checkbox">
            <label for="thing2">This will be read</label>
        </fieldset>
    </form>

1 个答案:

答案 0 :(得分:3)

这是配音和Chrome的错误。画外音用户绝大多数都使用Safari作为他们的主要浏览器,因为它主要是为这个屏幕阅读器/浏览器组合开发和测试的。 Chrome在屏幕阅读器方面存在许多问题,而这些问题并非主要针对它进行编写(例如画外音/ Safari和NVDA / Firefox)。我自己测试了这个例子,标签是用画外音和狩猎大声朗读的,但不是用Chrome浏览器 - 因为这些问题。

为了了解哪些浏览器/屏幕阅读器组合使用最多,webaim会定期提供一些非常有用的调查结果来跟踪这些趋势: http://webaim.org/projects/screenreadersurvey6/