Атрибут type HTML тега input

Атрибут type определяет тип элемента ввода.

Тип по умолчанию — text.

Этот атрибут не является обязательным, однако лучше всегда определять его.

Атрибут type для тега <input> поддерживается всеми основными браузерами, тем не менее не все браузеры корректно работают со всеми его значениями.

В HTML5 для атрибута type были добавлены следующие новые значения: color, date, datetime, datetime-local, month, week, time, email, number, range, search, tel, url.

Синтаксис атрибута

<input type="значение">

Значения атрибута

ЗначениеОписание
buttonОбычная кнопка (как правило используется для запуска скриптов Javascript).
checkboxФлажки, которые позволяют выбрать более одного варианта из предложенных.
colorДобавлен в HTML5.
Виджет для выбора цвета.
dateДобавлен в HTML5.
Поле выбора календарной даты.
datetimeДобавлен в HTML5.
Указание даты и времени.
datetime-localДобавлен в HTML5.
Указание местной даты и времени.
emailДобавлен в HTML5.
Для адресов электронной почты.
fileПоле для ввода имени файла, который пересылается на сервер.
hiddenСкрытое поле, которое не отображается на странице.
imageПоле с изображением. При нажатии на рисунок данные формы отправляются на сервер.
monthДобавлен в HTML5.
Выбор месяца.
numberДобавлен в HTML5.
Ввод чисел.
passwordТекстовое поле, в котором все символы показываются звездочками. Предназначено для того, чтобы никто не подглядел вводимый пароль.
radioПереключатели. Используются, когда следует выбрать один вариант из нескольких предложенных.
rangeДобавлен в HTML5.
Ползунок для выбора чисел в указанном диапазоне.
resetКнопка сброса данных в исходные значения.
searchДобавлен в HTML5.
Поле поиска.
submitКнопка отправки данных формы на сервер.
telДобавлен в HTML5.
Для телефонных номеров.
textТекстовое поле. Значение по умолчанию.
timeДобавлен в HTML5.
Для времени.
urlДобавлен в HTML5.
Для веб-адресов.
weekДобавлен в HTML5.
Выбор недели.

Пример использования атрибута

HTML форма с двумя разными элементами ввода — текстовое поле и кнопка отправки данных на сервер:


<form action="//msiter.ru/demo_form.asp">
   Имя пользователя: <input type="text" name="usrname"><br>
   <input type="submit" value="Отправить">
</form>