复杂标签的样式

Danielle Romo 讲解了在您有一个带有 <input type="radio"> 的花哨样式的冗长 <label> 时所需的 HTML 模式。

诀窍？ 使用旧的 <span class="hidden-visually"> 来包含要读取的标签，以及一个 <span aria-hidden="true"> 来包含仅供视觉显示的内容。

---

我认为人们经常使用这种模式很有趣。 您是否看过 Ethan 的 The World-Wide Work？ 他在此谈论的下降帽模式本质上与这种模式相同。

<span aria-hidden="true">
  Markup for the visual experience only,
  where you can (somewhat safely) use markup 
  that would be crap for screen readers.  
</span>

<span class="visually-hidden">
  Markup for the read experience only, that
  you keep very clean on purpose.
</span>

这个 类是这样的。

直接链接 →