问题

用于 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>


解决方法

根据 bootstrap的文档,该类用于隐藏仅适用于屏幕阅读器.

Screen readers will have trouble with your forms if you don't include a label for every input. For these inline forms, you can hide the labels using the .sr-only class.

以下是使用的示例样式:

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

Is it important or can I remove it? Works fine without.

这很重要,请勿移除.

您应该始终将屏幕阅读器视为可访问性.类的使用将隐藏元素,因此您不应该看到视觉差异.

如果您有兴趣阅读关于辅助功能的信息:




相关问题推荐