如何仅从屏幕阅读器隐藏任何元素,而不是从普通用户的页面隐藏?

如何仅从屏幕阅读器隐藏任何元素,而不是从普通用户的页面隐藏? 我知道这些片段,但我想隐藏屏幕重做的东西,但不是从视觉上的页面隐藏。 Sscreen阅读器应该跳过隐藏的部分。
/* 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; }
    
已邀请:
在元素上使用:
aria-hidden="true"
这会将该元素显示为视力正常的用户,但不会被屏幕阅读器朗读。     
我认为迈克尔上面的回答将是完成你想要的最符合语义的正确方法。他指出,唯一的问题是在screenreader browser支持上。 一种快速而肮脏的方式是将您想要的任何内容显示为图像,然后为其分配一个空白的替代文本值,例如
<img src="visualcontentonly.png" alt="" />
您想要从屏幕阅读器用户隐藏的内容是什么?可能有更合适的方法来处理这个问题。虽然将其显示为图像可以起作用,但从可访问性的角度来看,它可能会令人不悦,这取决于内容是什么。     
我不确定屏幕阅读器是否会遵循新的CSS3语音模块中的任何内容,但它可能是你可以测试的东西,因为它似乎是最简单的选择,如果它工作。 http://www.w3.org/TR/css3-speech/     

要回复问题请先登录注册