Bootstrap's Setări implicite
Controalele de formular individuale primesc automat unele stil la nivel mondial cu Bootstrap .
Toate textual <input>, <textarea> și <select> elemente cu class="form-control" sunt setate la lățime: 100%; în mod implicit.
Normele standard pentru Bootstrap forme:
- Adăugați role="form" la <form> elementul (ajută la îmbunătățirea accesibilității pentru persoanele care folosesc cititoare de ecran)
- Wrap etichete și controale de formă într - un <div> Element cu class="form-group" de class="form-group" (needed for optimum spacing)
- Adăugați class="form-control" de <input>, <textarea> <select> class="form-control" la toate textuale <input>, <textarea> și <select> elemente
Următorul exemplu creează un formular Bootstrap simplu, cu două câmpuri de intrare, o casetă de selectare, și un buton de trimitere:
Bootstrap Form Exemplu
<form role="form">
<div class="form-group">
<label for="email">Email address:</label>
<input
type="email" class="form-control" id="email">
</div>
<div class="form-group">
<label
for="pwd">Password:</label>
<input type="password"
class="form-control" id="pwd">
</div>
<div class="checkbox">
<label><input type="checkbox">
Remember me</label>
</div>
<button type="submit" class="btn btn-default">Submit</button>
</form>
Încearcă - l singur » <form> Clase
Clasă | Descriere | Exemplu |
---|---|---|
.form-inline | Face o <form> aliniate la stânga cu controale inline-bloc (Aceasta se aplică numai formulare din cadrul viewports care sunt cel puțin 768px larg) | Incearca-l |
.form-horizontal | Aliniază etichete și grupuri de controale de formă într-un aspect orizontal | Incearca-l |