我有一个具有背景图像的CSS类

例如:

.my_class_bg_image {
    background: url(myPhoto.jpg) 0 0 no-repeat;
}


我想使包含此CSS类的页面可访问。

我可以使用这个吗?

<span role="img" aria-labelledby="ddd" title="This is my bg image title" class="my_class_bg_image">
  <span id="ddd">This is my text which is shown when the image cannot be loaded,
     but it's also there and invisible and when the image load succeeds
  </span>
</span>


如果没有,如何使此类html元素可访问?
 -包含CSS类的html元素,这些CSS类包含bg图像

最佳答案

aria-labelledby与ID一起使用将使文本可供需要它的屏幕阅读器使用。如果您想明显地隐藏一些内容,我建议使用Yahoo提出的方法。将CSS添加到样式表后,只需在HTML中添加一个类(在本例中为sr-only)即可明显隐藏文本。

该代码将是:

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


这会将内容剪切掉(clip),隐藏所有溢出,对于不以“正确”方式呈现clip的浏览器,请对其进行绝对定位,以使它们脱离整体布局流程。

关于html - 如何使用aria-labeledby启用辅助功能?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/38293611/

10-14 14:37
查看更多