Bootstrap 中的 aria-label 和 aria-labelledby

经测试，aria-label 只有加在可被 tab 到的元素上，读屏才会读出其中的内容。

aria-labelledby

---

如果想要屏幕阅读器读的标签文本在其他元素中存在时，可以将其值为该元素的 id。设置 aria-labelledby 的值为某个元素的 id 。那么屏幕阅读器就可以读取它的值。

选择你的职业

• 教师

• 医生

• 学生

  当 ul 获取到焦点时，屏幕阅读器会读：“选择你的职业”。

  如果一个元素同时有 aria-labelledby 和 aria-label ，读屏软件会优先读出 aria-labelledby 的内容。

  总结

  –

  这两个属性是为特殊网页阅读器设置的属性，在一些特殊设备上，当浏览到这样的内容设备会将内容读出来。是为了一些有视力障碍的人能够同样”浏览”网页而准备的。

  —————————(正文完)————————————

  一个前端的学习交流群，想进来面基的，可以点击这个logo