主页 / coding / 问题 / 79334130
Accepted
Shtole
Asked: 2025-01-07 03:32:09 +0800 CST

我是否需要使用 aria-hidden 来在 <button> 内装饰 <svg>？

  • 772

如果我有一个按钮：

<button>
    <svg width="1em" class="inline"><use href="#start-icon"></use></svg>
    Start
</button>

屏幕阅读器会忽略它吗<svg>（这是期望的行为）或者我应该隐藏它（aria-hidden例如，使用）？

html

3 个回答

  1. 在这种情况下，使用role="presentation"而不是更合适aria-hidden="true"。 两者的效果都是一样的，即让元素及其子元素被屏幕阅读器忽略，但前者在隐藏“装饰性”元素方面在语义上更准确。 它让辅助技术知道那个东西只是为了装饰目的，可以安全地忽略它。

    • 2
  2. Best Answer

    默认情况下，如果内容可访问，屏幕阅读器会朗读<svg>内容。所以，你应该使用aria-hidden:)来隐藏它

    <svg width="1em" class="inline" aria-hidden="true"><use href="#start-icon"></use></svg>

    • 1

  3. 屏幕阅读器默认会读取 SVG ，所以你是对的，你应该使用它aria-hidden="true"来隐藏它

    • 1

相关问题