ale*_*dan 1 html accessibility
在 HTML 中，我想要这样的东西：
<p>A man, a ____, a canal, panama.</p>
我不希望下划线/下划线实际上是一个实际的文本输入框。在 HTML 中标记它以便可以访问屏幕阅读器的好方法是什么？如果可以表达下划线长度为四个字符，那就更好了。
也许我的例子离我的实际用例太远了。相反，想象一个简单的 HTML 数学课，并且可以看到类似这样的内容：
2 + ___ = 5
没有交互性——读者无法在输入字段中实际填写 3。这只是对读者的练习，也许他们可以在其他地方查找答案。如果我只使用下划线或 CSS 下划线，则屏幕阅读器用户不会知道那里有空白。他们听到“二加等于五”。
根据屏幕阅读器的“详细程度”设置，某些符号可能会被忽略。例如，逗号、句号和括号通常不会按字面意思表示。下划线也经常被忽略。但是，用户可以更改他们的屏幕阅读器设置来收听它们。但在您的情况下，无需更改设置即可听到完整的表达。
您可以使用aria-label属性为元素提供替代文本。但是，aria-label如果它用于非语义元素，则并不总是宣布。参见“ 2.10 实践支持：aria-label、aria-labelledby 和 aria-describedby ”，特别是关于 <div> 和 <span> 的倒数第三点。
为了aria-label得到尊重，元素必须具有语义role。
例如，如果您有：
<p>2 + ___ = 5</p>
下划线将被忽略。在 Firefox 上使用 NVDA，我听到“二加等于五”。为了解决这个问题，我可以给“____”一个aria-label.
<p>2 + <span aria-label="4 underscores">___</span> = 5</p>
但是，由于上述问题，<span> 元素没有任何语义意义，因此aria-label被忽略，您需要role为 <span>想出一个。
如果您真的要展示数学表达式，以下内容适用于 firefox 上的 NVDA 和 iOS 上的 VoiceOver：
<p>2 + <span role="math" aria-label="4 underscores">___</span> = 5</p>
我听到“二加四下划线等于 5”。
我不确定“数学”在这里是否真的是正确的角色，但是通过我有限的测试，它确实可以满足您的需求。您可能需要查看其他可用角色。