Создание форм на Bootstrap3

Здравствуйте! Сегодня давайте разберемся как с помощью фреймворка Бутстрап можно создавать красивые адаптивные формы. Bootstrap позволяет добавлять оформление для любых форм на странице. Формы, созданные на Bootstrap, могут быть горизонтальными и вертикальными.

Настройки по умолчанию

Элементы <input>, <textarea> и <select> при добавлении к ним класса .form-control становятся блочными и занимают 100% ширины родительского блока.

Типы форм в Bootstrap

При помощи различных классов вы можете оформить форму

вертикально
горизонтально
в виде строчных элементов (в одну строку)

Есть три основных правила для создания форм в бутстрапе:

используйте <form role="form"> для их создания
все элементы формы и их названия должны находиться в блоке <div class="form-group">, это требуется для оптимальных отступов между строками
добавляйте класс .form-control для элементов <input>, <textarea> и <select> Читать далее

		Это интересно 0	Как всё будет выглядеть в блоге: Создание форм на Bootstrap3 Здравствуйте! Сегодня давайте разберемся как с помощью фреймворка Бутстрап можно создавать красивые адаптивные формы Скопируйте код для блога: <div style="border:1px solid #E8E8E8;margin:10px auto;padding:10px 15px;"> <a href="https://subscribe.ru/" style="display:block;"><img src="https://subscribe.ru/img/logokanal.png" style="margin:0;border: 0;" alt=""/></a> <a href="https://subscribe.ru/group/poleznyie-servisyi-i-programmyi-dlya-nachinayuschih-polzovatelej/14081633/" style="border-color:#E8E8E8;border-style:solid;border-width:1px 0;color:#555555;display:block;font-family:trebuchet MS;font-size:1.2em; font-weight:bold;margin:5px 0;padding:5px 0;text-decoration:none;"> Создание форм на Bootstrap3 </a> <div class="insert-intro" style="font-family:trebuchet MS;">Здравствуйте! Сегодня давайте разберемся как с помощью фреймворка Бутстрап можно создавать красивые адаптивные формы </div> </div> Создание форм на Bootstrap3 <div style="border:1px solid #E8E8E8;margin:10px auto;padding:10px 15px;"> <a href="https://subscribe.ru/" style="display:block;"><img src="https://subscribe.ru/img/logokanal.png" style="margin:0;border: 0;" alt=""/></a> <a href="https://subscribe.ru/group/poleznyie-servisyi-i-programmyi-dlya-nachinayuschih-polzovatelej/14081633/" style="border-color:#E8E8E8;border-style:solid;border-width:1px 0;color:#555555;display:block;font-family:trebuchet MS;font-size:1.2em; font-weight:bold;margin:5px 0;padding:5px 0;text-decoration:none;">Создание форм на Bootstrap3</a> <div style="font-family:trebuchet MS;">Здравствуйте! Сегодня давайте разберемся как с помощью фреймворка Бутстрап можно создавать красивые адаптивные формы </div> </div>

webguru

06.09.2017

В избранное Пожаловаться Просмотров: 318

Комментарии ⁰

Полезные сервисы и программы для начинающих пользователей 7268

Важные темы:

Активные участники:

Последние откомментированные темы:

Создание форм на Bootstrap3

Комментарии временно отключены

Открытая группа
38977 участников