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

Require .form-label classes on form labels (#30476)

Browse Source
This commit is contained in:
Martijn Cuppens
2020-03-31 20:02:57 +02:00
committed by GitHub
parent a0c2a29a8d
commit df707cd727
17 changed files with 82 additions and 73 deletions
Download Patch File Download Diff File Expand all files Collapse all files
site/content/docs/4.3/forms/overview.md
+5 -5
View File
@@ -35,12 +35,12 @@ Here's a quick example to demonstrate Bootstrap's form styles. Keep reading for
{{< example >}}
<form>
<div class="mb-3">
<label for="exampleInputEmail1">Email address</label>
<label for="exampleInputEmail1" class="form-label">Email address</label>
<input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp">
<small id="emailHelp" class="form-text text-muted">We'll never share your email with anyone else.</small>
</div>
<div class="mb-3">
<label for="exampleInputPassword1">Password</label>
<label for="exampleInputPassword1" class="form-label">Password</label>
<input type="password" class="form-control" id="exampleInputPassword1">
</div>
<div class="mb-3 form-check">
@@ -64,7 +64,7 @@ Help text should be explicitly associated with the form control it relates to us
Help text below inputs can be styled with `.form-text`. This class includes `display: block` and adds some top margin for easy spacing from the inputs above.
{{< example >}}
<label for="inputPassword5">Password</label>
<label for="inputPassword5" class="form-label">Password</label>
<input type="password" id="inputPassword5" class="form-control" aria-describedby="passwordHelpBlock">
<small id="passwordHelpBlock" class="form-text text-muted">
Your password must be 8-20 characters long, contain letters and numbers, and must not contain spaces, special characters, or emoji.
@@ -105,11 +105,11 @@ By default, browsers will treat all native form controls (`<input>`, `<select>`,
<form>
<fieldset disabled aria-label="Disabled fieldset example">
<div class="mb-3">
<label for="disabledTextInput">Disabled input</label>
<label for="disabledTextInput" class="form-label">Disabled input</label>
<input type="text" id="disabledTextInput" class="form-control" placeholder="Disabled input">
</div>
<div class="mb-3">
<label for="disabledSelect">Disabled select menu</label>
<label for="disabledSelect" class="form-label">Disabled select menu</label>
<select id="disabledSelect" class="form-select">
<option>Disabled select</option>
</select>