aria-hidden
aria
属性用于使残障人士更容易访问 Web,尤其是那些使用屏幕阅读器的人。借助视觉,我们可以看到 × (x) 符号被用作“X”,表示如果单击它,模态将关闭。对于使用屏幕阅读器的人,如果模式设置正确:
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
当屏幕阅读器浏览此代码时,它会简单地读取“关闭按钮”。
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span>×</span>
</button>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">×
</button>
当屏幕阅读器阅读时,这两者都会导致相同的结果,它会说“关闭乘法符号按钮”或类似的东西。
<button type="button" class="close" data-dismiss="modal" aria-label="Close" aria-hidden="true">×
</button>
在最后一种情况下,将 aria-hidden=“true” 添加到按钮本身将使屏幕阅读器忽略整个关闭按钮,迫使用户在找到关闭按钮之前继续阅读页脚(如果有关闭按钮页脚,如果没有,他们将很难关闭它)