html - Bootstrap5 sr only - Bootstrap 3のsr-onlyとは何ですか?

control-label bootstrap / html / css / twitter-bootstrap / twitter-bootstrap-3

クラス 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>

bzeaman



Answer #1

オブジェクトが読者や同様のデバイスにのみ表示される(または表示されるべき)ことを保証します。aria-hidden="true "の属性を持つ他の要素との関係で、より意味を持つようになります。

<div class="alert alert-danger" role="alert">
  <span class="glyphicon glyphicon-exclamation-sign" aria-hidden="true"></span>
  <span class="sr-only">Error:</span>
  Enter a valid email address
</div>