提问人：Jitendra Vyas 提问时间：1/26/2011 更新时间：11/27/2012 访问量：2944
如何仅从屏幕阅读器中隐藏页面中的任何元素，而不从普通用户的页面中隐藏任何元素？
How to hide any element from page only from Screenreader but not from page for normal users?
问：
如何仅从屏幕阅读器中隐藏页面中的任何元素，而不从普通用户的页面中隐藏任何元素？
我知道这些片段，但我想从屏幕重定向器中隐藏一些东西，而不是在视觉上从页面中隐藏一些东西。屏幕阅读器应跳过隐藏部分。
/* Hide for both screenreaders and browsers
css-discuss.incutio.com/wiki/Screenreader_Visibility */
.hidden { display: none; visibility: hidden; }
/* Hide only visually, but have it available for screenreaders
www.webaim.org/techniques/css/invisiblecontent/ ; & j.mp/visuallyhidden ; */
.visuallyhidden { position: absolute !important;
clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
clip: rect(1px, 1px, 1px, 1px); }
/* Hide visually and from screenreaders, but maintain layout */
.invisible { visibility: hidden; }
答：
0赞
Michael Irigoyen
1/26/2011
#1
我不确定屏幕阅读器是否会遵守新的 CSS3 语音模块中的任何内容，但这可能是您可以测试的东西，因为如果它有效，这似乎是最简单的选择。
http://www.w3.org/TR/css3-speech/
评论
0赞
Colin Pickard
1/26/2011
我认为许多屏幕阅读器不支持，或者尽管它们已经存在了很多年，所以 CSS3 语音似乎不太可能@media aural@media speech
1赞
Michael Irigoyen
1/26/2011
吸。我希望这些东西能得到支持。这将使我们的生活变得更加轻松。
3赞
discojoe
1/26/2011
#2
我认为迈克尔上面的回答将是实现你想要的最语义上最合理和最正确的方式。正如他指出的那样，唯一的问题是屏幕阅读器\浏览器支持。
一种快速而肮脏的方法是将您想要的任何内容直观地显示为图像，然后为其分配一个空白的替代文本值，例如
<img src="visualcontentonly.png" alt="" />
您想对屏幕阅读器用户隐藏哪些内容？可能有一种更合适的方法来处理这个问题。虽然将其显示为图像是可行的，但从可访问性的角度来看，它可能会不受欢迎，具体取决于内容是什么。
7赞
David Ball
11/27/2012
#3
在元素上使用以下命令：
aria-hidden="true"
这会将元素显示为正常的视觉用户，但屏幕阅读器不会大声朗读。
评论
0赞
theJBRU
4/26/2013
对于 JAWS 12.0 来说，情况并非如此。虽然未来的辅助设备可能会支持此功能，但该功能目前尚未普遍实现。
0赞
Andy
2/22/2023
虽然我无法测试这一点，但我发现很难相信。屏幕阅读器依赖于浏览器的可访问性 API，并且所有浏览器都尊重它们，因为它们会从辅助技术中隐藏相应的 DOM。aria-hidden
评论