Что такое input в HTML5?
HTML тег
<input> позволяет создавать различные поля ввода или же выбора значения для html-форм. При использовании тега input без дополнительных атрибутов будет создано простейшее текстовое поле. Закрывающий тег не требуется. При помощи атрибута type вы можете указать каким полем будет этот input, к примеру:
password- создание поля для ввода пароля;text- создания простейшего текстового поля;email- создания поля для ввода email;hidden- создания скрытого поля;checkbox- создания поля для проставления галочки;radio- создания поля с возможностью выбрать вариант;button- создание кнопки;submit- создание кнопки с перезагрузкой страницы;reset- создание кнопки для очистки формы;file- создание кнопки выбора файла с компьютера;color- создание поля для выбора цвета;time- создание поля для выбора даты;image- создание поля с изображением;
Это лишь часть тех возможных значений атрибута type, которые вы можете применить на своем сайте.
Атрибуты:
- type - задает значение (тип) поля;
- form - нужен для связки поля с формой по id;
- checked - устанавливает поставлена ли галочка или же выбрана radio кнопка по умолчанию;
- disabled - отключает поле для ввода или любой другой взаимосвязи с ним;
- placeholder - текст подсказки прямиком в поле;
- readonly - возможно указать что поле не будет возможным для редактирования пользователем;
- required - устанавливает обязательное ли это поле или нет;
- value - устанавливается значение поля.
Пример:
<h2>Форма с полями</h2>
<form>
<input type="text" name="name" id="name" placeholder="Ваше имя"><br>
<label for="maleFemale">Выберите ваш пол</label><br>
<input type="radio" name="maleFemale" id="maleFemale" value="male">
<label>Мужчина</label>
<input type="radio" name="maleFemale" id="maleFemale" value="female">
<label>Женщина</label><br>
<label>Ваш любимый цвет</label><br>
<input type="color" id="color"><br>
<input type="submit" value="Отправить">
<input type="reset" value="Очистить">
</form>Результат:
Форма с полями
Комментарии (1)
