Bootstrap's умолчанию Настройки
Отдельные элементы управления формы автоматически получают некоторый глобальный стиль с Bootstrap .
Вся текстовая <input>, <textarea> , и <select> элементы с class="form-control" устанавливаются ширина: 100%; по умолчанию.
Стандартные правила Bootstrap форм:
- Добавить role="form" к <form> элемент (помогает улучшить доступность для людей , использующих программы чтения с экрана)
- Оберните этикетки и элементы формы в <div> элемент с class="form-group" (необходимо для оптимального интервала)
- Добавить class="form-control" для всех текстовых <input>, <textarea> и <select> элементы
Следующий пример создает простую форму Bootstrap с двумя полями ввода, один флажок, и кнопку отправки:
Bootstrap пример формы
<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> Попробуй сам " <form> Классы
| Класс | Описание | пример |
|---|---|---|
| .form-inline | Делает <form> выравнивается по левому краю с элементами управления рядный блок (Это относится только к формам в пределах viewports , которые , по крайней мере 768px в ширину) | Попробуй |
| .form-horizontal | Выравнивает этикетки и группы элементов управления формы в горизонтальной компоновки | Попробуй |