如何让屏幕阅读器阅读的div不同的文本(How to make screenreader read

我有这样一个div： <div class="whatever">17:03</div>

当有人使用屏幕阅读器悬停在该文本，我想它读“十七分3秒”

什么是这样做的标准做法？

Answer 1:

您可以仅包含屏幕阅读一些附加的文字：

<div class="whatever">17<span class="sr-only"> minutes and </span>:03<span class="sr-only">seconds</span></div>

和CSS（从引导3-3）

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

Answer 2:

最后我只是把英文文本晓月标签，因为这DIV是一个标签里面，所以它的最终通过屏幕阅读器读取时，它是在咏叹调标签，而不会产生任何额外的标签目标的信息。

文章来源: How to make screenreader read different text in div