什么是班级sr-only
用于?它重要吗?或者我可以删除它吗?没有的话也能正常工作。
这是我的例子:
<div class="btn-group">
<button type="button" class="btn btn-info btn-md">Departments</button>
<button type="button" class="btn btn-info dropdown-toggle btn-md" data-toggle="dropdown">
<span class="caret"></span>
<span class="sr-only">Toggle Dropdown</span>
</button>
<ul class="dropdown-menu" role="menu">
<li><a href="#">Sales</a></li>
<li><a href="#">Technical</a></li>
<li class="divider"></li>
<li><a href="#">Show all</a></li>
</ul>
</div>
根据引导程序的文档,该类用于隐藏仅用于屏幕阅读器从渲染页面的布局。
如果您没有为每个输入添加标签,屏幕阅读器将会遇到麻烦。对于这些内联表单,您可以使用 .sr-only 类隐藏标签。
这是一个example使用的样式:
.sr-only {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0,0,0,0);
border: 0;
}
它重要吗?或者我可以删除它吗?没有的话也能正常工作。
这很重要,不要删除它。
您应该始终考虑将屏幕阅读器用于辅助功能。无论如何,使用该类都会隐藏该元素,因此您不应该看到视觉差异。
如果您有兴趣阅读有关可访问性的内容:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)