root
/
bootstrap
mirror of https://github.com/twbs/bootstrap.git
1
0
Fork 0
Code Issues Actions 12 Packages Projects Releases Wiki Activity

Camel casing `id`s and `for`s

This commit is contained in:
Julien Déramond 2025-02-15 13:20:50 +01:00
parent dd69ece86a
commit 1925723e3e
No known key found for this signature in database
GPG Key ID: EE5F274EA1F477FA
1 changed files with 18 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
site/content/docs/5.3/forms/checks-radios.md
View File

@ -74,14 +74,14 @@ Add the `disabled` attribute and the associated `<label>`s are automatically sty
{{< example >}} {{< example >}}
<div class="form-check"> <div class="form-check">
<input class="form-check-input" type="radio" name="RadioDefault" id="RadioDefault1"> <input class="form-check-input" type="radio" name="RadioDefault" id="radioDefault1">
<label class="form-check-label" for="RadioDefault1"> <label class="form-check-label" for="radioDefault1">
Default radio Default radio
</label> </label>
</div> </div>
<div class="form-check"> <div class="form-check">
<input class="form-check-input" type="radio" name="RadioDefault" id="RadioDefault2" checked> <input class="form-check-input" type="radio" name="RadioDefault" id="radioDefault2" checked>
<label class="form-check-label" for="RadioDefault2"> <label class="form-check-label" for="radioDefault2">
Default checked radio Default checked radio
</label> </label>
</div> </div>
@ -93,14 +93,14 @@ Add the `disabled` attribute and the associated `<label>`s are automatically sty
{{< example >}} {{< example >}}
<div class="form-check"> <div class="form-check">
<input class="form-check-input" type="radio" name="RadioDisabled" id="RadioDisabled" disabled> <input class="form-check-input" type="radio" name="RadioDisabled" id="radioDisabled" disabled>
<label class="form-check-label" for="RadioDisabled"> <label class="form-check-label" for="radioDisabled">
Disabled radio Disabled radio
</label> </label>
</div> </div>
<div class="form-check"> <div class="form-check">
<input class="form-check-input" type="radio" name="RadioDisabled" id="RadioCheckedDisabled" checked disabled> <input class="form-check-input" type="radio" name="RadioDisabled" id="radioCheckedDisabled" checked disabled>
<label class="form-check-label" for="RadioCheckedDisabled"> <label class="form-check-label" for="radioCheckedDisabled">
Disabled checked radio Disabled checked radio
</label> </label>
</div> </div>
@ -112,20 +112,20 @@ A switch has the markup of a custom checkbox but uses the `.form-switch` class t
{{< example >}} {{< example >}}
<div class="form-check form-switch"> <div class="form-check form-switch">
<input class="form-check-input" type="checkbox" role="switch" id="SwitchcheckDefault"> <input class="form-check-input" type="checkbox" role="switch" id="switchcheckDefault">
<label class="form-check-label" for="SwitchcheckDefault">Default switch checkbox input</label> <label class="form-check-label" for="switchcheckDefault">Default switch checkbox input</label>
</div> </div>
<div class="form-check form-switch"> <div class="form-check form-switch">
<input class="form-check-input" type="checkbox" role="switch" id="SwitchCheckChecked" checked> <input class="form-check-input" type="checkbox" role="switch" id="switchCheckChecked" checked>
<label class="form-check-label" for="SwitchCheckChecked">Checked switch checkbox input</label> <label class="form-check-label" for="switchCheckChecked">Checked switch checkbox input</label>
</div> </div>
<div class="form-check form-switch"> <div class="form-check form-switch">
<input class="form-check-input" type="checkbox" role="switch" id="SwitchCheckDisabled" disabled> <input class="form-check-input" type="checkbox" role="switch" id="switchCheckDisabled" disabled>
<label class="form-check-label" for="SwitchCheckDisabled">Disabled switch checkbox input</label> <label class="form-check-label" for="switchCheckDisabled">Disabled switch checkbox input</label>
</div> </div>
<div class="form-check form-switch"> <div class="form-check form-switch">
<input class="form-check-input" type="checkbox" role="switch" id="SwitchCheckCheckedDisabled" checked disabled> <input class="form-check-input" type="checkbox" role="switch" id="switchCheckCheckedDisabled" checked disabled>
<label class="form-check-label" for="SwitchCheckCheckedDisabled">Disabled checked switch checkbox input</label> <label class="form-check-label" for="switchCheckCheckedDisabled">Disabled checked switch checkbox input</label>
</div> </div>
{{< /example >}} {{< /example >}}
@ -222,8 +222,8 @@ Put your checkboxes, radios, and switches on the opposite side with the `.form-c
</div> </div>
<div class="form-check form-switch form-check-reverse"> <div class="form-check form-switch form-check-reverse">
<input class="form-check-input" type="checkbox" id="SwitchCheckReverse"> <input class="form-check-input" type="checkbox" id="switchCheckReverse">
<label class="form-check-label" for="SwitchCheckReverse">Reverse switch checkbox input</label> <label class="form-check-label" for="switchCheckReverse">Reverse switch checkbox input</label>
</div> </div>
{{< /example >}} {{< /example >}}