我在 bootstrap 的很多地方都找到了这些属性。我在 google 中搜索了它们并询问了很多人。但是找不到合适的答案。
虽然我在这个网站上找到了一些关于“aria-hidden”的答案,但我还是不清楚。所以,如果有人向我描述“aria-hidden”和“aria-discribedby”,那将会很有帮助。
最佳答案
先决条件:
Aria 用于改善视障用户的用户体验。视障用户使用 JAWS、NVDA 等屏幕阅读器软件在应用程序中导航。在应用程序中导航时,屏幕阅读器软件会向用户宣布内容。 Aria 可用于在代码中添加内容,帮助屏幕阅读器用户了解控件的 Angular 色、状态、标签和用途。
Aria 不会在视觉上改变任何东西。 (Aria 也害怕设计师)。
咏叹调描述者
aria-describedby 用于传达除标签之外的控件的附加信息。 aria-describedby 可用于多种用途,如错误消息、工具提示、附加控制说明。
如何使用
<label for = "email"> Email </label>
<input type = "text" id = "email" aria-describedby = "email-error">
<span id = "email-error"> Error: Invalid Email Address </span>
aria-describedby 的值与<span>
的id 值相同包含错误信息。当电子邮件控件接收到焦点、标签、控件类型时,将向用户宣布错误消息。在这种情况下,屏幕阅读器会宣布“电子邮件编辑字段”,并在暂停后显示“错误:电子邮件地址无效”
aria-hidden:
aria-hidden 属性用于为使用屏幕阅读器(JAWS、NVDA 等)浏览应用程序的视障用户隐藏内容。
aria-hidden 属性与值 true、false 一起使用。
例如:
<i class = "fa fa-books" aria-hidden = "true"></i>
在 <i>
上使用 aria-hidden = "true"在应用程序中没有视觉变化的情况下向屏幕阅读器用户隐藏内容。
关于html - "aria-describedby"和 "aria-hidden"属性如何在 Bootstrap 中工作?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32196881/