mirrors/bootstrap
2
0
Fork 0
mirror of https://github.com/tenrok/bootstrap.git synced 2026-06-11 18:02:28 +03:00
Code Activity

Add explicit aria-label to unlabeled controls

Browse Source 
- in particular, controls that just relied on `placeholder`, as this is still not officially/consistently supported as a valid way to provide an accessible name (though some browsers do use it as a fallback)
This commit is contained in:
Patrick H. Lauke
2020-03-22 22:33:33 +02:00
committed by XhmikosR
parent a68f73e754
commit 00ff5b83f9
5 changed files with 22 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files
site/content/docs/4.3/forms/select.md
+5 -5
View File
@@ -11,7 +11,7 @@ toc: true
Custom `<select>` menus need only a custom class, `.form-select` to trigger the custom styles. Custom styles are limited to the `<select>`'s initial appearance and cannot modify the `<option>`s due to browser limitations.
{{< example >}}
<select class="form-select">
<select class="form-select" aria-label="Default select example">
<option selected>Open this select menu</option>
<option value="1">One</option>
<option value="2">Two</option>
@@ -24,14 +24,14 @@ Custom `<select>` menus need only a custom class, `.form-select` to trigger the
You may also choose from small and large custom selects to match our similarly sized text inputs.
{{< example >}}
<select class="form-select form-select-lg mb-3">
<select class="form-select form-select-lg mb-3" aria-label=".form-select-lg example">
<option selected>Open this select menu</option>
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
</select>
<select class="form-select form-select-sm">
<select class="form-select form-select-sm" aria-label=".form-select-sm example">
<option selected>Open this select menu</option>
<option value="1">One</option>
<option value="2">Two</option>
@@ -42,7 +42,7 @@ You may also choose from small and large custom selects to match our similarly s
The `multiple` attribute is also supported:
{{< example >}}
<select class="form-select" multiple>
<select class="form-select" multiple aria-label="multiple select example">
<option selected>Open this select menu</option>
<option value="1">One</option>
<option value="2">Two</option>
@@ -53,7 +53,7 @@ The `multiple` attribute is also supported:
As is the `size` attribute:
{{< example >}}
<select class="form-select" size="3">
<select class="form-select" size="3" aria-label="size 3 select example">
<option selected>Open this select menu</option>
<option value="1">One</option>
<option value="2">Two</option>