思考如何解决工具提示

在今天的 GUI 挑战中,@AdamArgyleInk 使用了自定义元素(不使用 Web 组件!)构建提示,:has()、转换和逻辑属性。除了用于使用 :has() 的小型备份脚本之外,它完全由 CSS 提供支持。别错过屏幕阅读器体验,它一如既往地受到了特别关注。

章节:

  • 0:00 - 简介
  • 0:20 - 提示与切换提示
  • 2:22 - 功能概述
  • 6:25 - 屏幕阅读器用户体验
  • 9:06 - 无障碍功能树
  • 14:12 - :has()
  • 14:55 - HTML
  • 15:18 - CSS
  • 18:50 - JavaScript
  • 20:21 - 结尾

资源:

观看更多 GUI 挑战 → https://goo.gle/GUIchallenges

订阅 Google Chrome Developers 频道 → https://goo.gle/ChromeDevs

返回到所有分集