Тег input - является пустым элементом и содержит только атрибуты. Используется в пределах элемента , объявляя элементы управления для пользовательского ввода, которые позволяют пользователю вводить различные данные. Связать текст с определенным элементом формы(сделать его активным) можно с помощью тега .

Поля для пользовательского ввода могут значительно отличаться друг от друга. В зависимости от значения атрибута type, поле ввода может быть текстовым полем, полем для пароля, радио кнопкой, простой кнопкой и тд.

accept:

Указывает типы файлов, которые могут быть переданы на сервер через поле загрузки файлов. Если тип загружаемого файла не совпадает ни с одним из типов файлов, указанных в значении, то файл будет игнорироваться. При указании нескольких значений, они должны разделяться запятой. Атрибут accept работает только совместно с атрибутом type="file", его возможные значения:

• audio/* - принимаются все звуковые файлы.
• video/* - принимаются все видео файлы.
• image/* - принимаются все файлы изображений.
• MIME_тип - принимается допустимый MIME-тип без параметров.

Совет: не рекомендуется использовать этот атрибут, как инструмент для проверки типа загружаемого файла. Загруженные файлы должны проверятся на сервере.

Примечание: атрибут accept не поддерживается в IE9 и более ранних версиях.

alt:

Предоставляет альтернативный текст для пользователя, если он по каким-либо причинам не может просматривать изображения. Атрибут alt может использоваться только совместно с атрибутом type="image".

autocomplete:

Определяет, будет ли включено автозаполнение для поля ввода данных:

• on - браузер автоматически показывает значения вводимые ранее пользователем (значение по умолчанию).
• off - пользователь должен сам вводить значения для поля при каждом использовании формы. Ранее вводимые значения показываться не будут.

Примечание: атрибут autocomplete работает со следующими значениями атрибута type элемента input: text, search, url, tel, email, password, datepickers, range и color.

autofocus:

Указывает браузеру, что элемент input должен получить фокус после загрузки страницы. Значения для логического атрибута autofocus можно задавать следующими способами:

input autofocus 
input autofocus="autofocus" 
input autofocus="" 

Примечание: атрибут autofocus не поддерживается в IE9 и более ранних версиях.

checked:

Указывает, что данный элемент будет выбран по умолчанию при загрузке страницы. Работает только с атрибутом type="checkbox" или type="radio". Значения для логического атрибута checked можно задавать следующими способами:

input checked 
input checked="checked" 
input checked=""

disabled:

Указывает, что элемент input должен быть выключен (выключенный элемент является неактивным). Значения для логического атрибута disabled можно задавать следующими способами:

input disabled 
input disabled="disabled" 
input disabled="" 

Примечание: атрибут disabled не работает с input type="hidden".

form:

Определяет форму с которой связан элемент input. В качестве значения атрибута выступает идентификатор элемента form. Этот атрибут позволяет размещать элемент input в произвольном месте документа, а не только в качестве потомка элемента form. Элемент input может быть связан только с одной формой.

Если атрибут form не указан, то элемент input должен быть потомком элемента form.

Примечание: атрибут form не поддерживается в IE.

formaction:

Указывает URL-адрес файла, который будет обрабатывать данные ввода, при отправке формы. Атрибут formaction используется только с type="submit" или type="image", и переопределяет атрибут action элемента form.

Примечание: атрибут formaction не поддерживается в IE9 и более ранних версиях.

formenctype:

Определяет способ кодирования данных формы при отправке на сервер. Может использоваться только совместно с атрибутом method="post" элемента form. Возможные значения:

• application/x-www-form-urlencoded - значение по умолчанию: все символы кодируются перед отправкой (пробелы преобразуются в символ "+", а специальные символы в значения ASCII HEX).
• multipart/form-data - символы не кодируются. Используется для элементов input, у которых в атрибуте type установлено значение "file".
• text/plain - пробелы преобразуются в символ "+", но не кодирует в шестнадцатеричные значения спецсимволы, такие как апострофы.

Атрибут formenctype используется только совместно с type="submit" или type="image", и переопределяет атрибут enctype элемента form.

Примечание: атрибут formenctype не поддерживается в IE9 и более ранних версиях.

formmethod:

Определяет HTTP метод для отправки данных на указанный URL (для type="submit" и type="image"):

• get - данные формы добавляются в конце URL-адреса: URL-адрес?имя=значение?имя=значение (значение по умолчанию).
• post - отправляет данные формы, как HTTP после транзакции.

Атрибут formmethod может использоваться только совместно с type="submit" или type="image", и переопределяет атрибут method элемента form.

Примечание: атрибут formmethod не поддерживается в IE9 и более ранних версиях.

formnovalidate:

Указывает, что данные введенные в поле ввода не будут проверяться перед отправкой. Возможные значения логического атрибута novalidate:

input formnovalidate 
input formnovalidate="formnovalidate" 
input formnovalidate="" 

Примечание: атрибут formnovalidate не поддерживается в IE9 и более ранних версиях, и в Safari.

formtarget:

Определяет имя фрейма или ключевое слово, которое указывает место для отображения ответа, полученного после отправки формы:

• _blank - открывает документ в новом окне или вкладке.
• _self - открывает документ в той же директории, где располагается ссылка (значение по умолчанию).
• _parent - открывает документ в родительском фрейме.
• _top - открывает документ во всю ширину окна.
• имя_фрейма - открывает документ в iframe, имя которого было указано в качестве значения.

Атрибут formtarget может использоваться только совместно с type="submit" или type="image", и переопределяет атрибут target элемента form.

Примечание: атрибут formtarget не поддерживается в IE9 и более ранних версиях.

height:

Определяет высоту элемента в пикселях, используется только с input type="image" (пример: height="100").

list:

Устанавливает взаимосвязь между элементом и input, позволяя для поля ввода указать список предварительно определенных вариантов. В качестве значения для атрибута выступает идентификатор элемента datalist.

Примечание: атрибут list не поддерживается в IE9 и более ранних версиях, и в Safari.

max:

Указывает максимальное значение для ввода числа или даты. Можно использовать атрибут max совместно с атрибутом min для создания диапазона допустимых значений.

• число - указывает максимально допустимое значение.
• дата - указывает маскимальную дату, разрешенную для ввода.

Атрибуты min и max работают со следующими значениями атрибута type: number, range, date, datetime, datetime-local, month, time и week.

Примечание: атрибут max не поддерживается в IE9 и более ранних версиях, и в Firefox.

maxlength:

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

min:

Определяет минимальное значение для ввода числа или даты.

• число - указывает минимально допустимое значение.
• дата - указывает минимальную дату, разрешенную для ввода.

!DOCTYPE html 
html 
body 
form action="demo_form.php" 
 Введите дату до 1980-01-01: 
 input type="date" name="bday" max="1979-12-31"br 
 Введите дату после 2000-01-01: 
 input type="date" name="bday" min="2000-01-02"br 
 Введите число (от 1 до 5): 
 input type="number" name="quantity" min="1" max="5"br 
 input type="submit" 
/form 
/body 
/html 

Примечание: атрибут min не поддерживается в IE9 и более ранних версиях, и в Firefox.

multiple:

Указывает, что пользователь может ввести более одного значения. Атрибут multiple работает только с type="email" и type="file". Возможные значения логического атрибута multiple:

input multiple 
input multiple="multiple" 
input multiple="" 

Примечание: атрибут multiple не поддерживается в IE9 и более ранних версиях.

name:

Атрибут name определяет имя элемента, оно отправляется на сервер вместе с введенными в поле данными. Имя может использоваться в JavaScript для ссылки на элемент или для идентификации переданных данных на сервере (например, при обработке данных на сервере, имя элемента позволяет определить, что было введено в качестве имени пользователя, а что - в качестве пароля).

pattern:

Указывает регулярное выражение, которое определяет синтаксис данных, ввод которых должен быть разрешен в поле ввода. Шаблон регулярного выражения должен соответствовать введенному значению целиком. Для описания работы шаблона можно воспользоваться глобальным атрибутом title. Атрибут pattern работает со следующими значениями атрибута type: text, search, url, tel, email и password.

Примечание: атрибут pattern не поддерживается в IE9 и более ранних версиях, и в Safari.

placeholder:

Определяет короткую подсказку, которая описывает ожидаемое значение для поля ввода (пример: образец значения или краткое описание ожидаемого формата). Подсказка отображается в поле ввода, когда оно пустое и исчезает, когда пользователь начинает вводить данные или когда поле получает фокус (разница в работе атрибута зависит от используемого браузера), если поле теряет фокус и при этом данные в поле не были введены, то в поле ввода вновь отобразится подсказка.

Атрибут placeholder работает со следующими значениями атрибута type: text, search, url, tel, email и password.

Примечание: атрибут placeholder не поддерживается в IE9 и более ранних версиях.

readonly:

Указывает, что поле ввода может быть использовано только для чтения и не может быть изменено (однако, текст можно выделить и скопировать). Возможные значения логического атрибута readonly:

input readonly 
input readonly="readonly" 
input readonly=""

required:

Указывает, что поле ввода необходимо заполнить перед отправкой формы. Если пользователь попытается отправить форму, не введя в поле никакого значения, то на экране отобразится предупреждающее сообщение. Это сообщение будет отличаться по содержанию и стилизации в зависимости от браузера и типа поля ввода.

Атрибут required работает со следующими значениями атрибута type: text, search, url, tel, email, password, date pickers, number, checkbox, radio и file. Возможные значения логического атрибута required:

input required 
input required="required" 
input required="" 

Примечание: атрибут required не поддерживается в IE9 и более ранних версиях, и в Safari.

size:

Указывает ширину поля ввода (в качестве единицы измерения выступает количество видимых символов). Так, например, значение 3 создает поле ввода текста, ширина которого достаточна для отображение трех введенных символов (хотя пользователь при желании может ввести и большее количество). Атрибут size работает со следующими значениями атрибута type: text, search, tel, url, email и password. Для указания максимального количества вводимых знаков, воспользуйтесь атрибутом maxlength.

src:

Указывает путь к графическому файлу для поля с изображением. Атрибут src является обязательным для элементов input с type="image" и может использоваться только с ними.

step:

Определяет интервал чисел для элемента input. Пример: если step="3", то возможные значения чисел могут быть: -3, 0, 3, 6 и тд. Атрибут step может использоваться совместно с атрибутами max и min, для создания диапазона допустимых значений.

Примечание: атрибут step не поддерживается в IE9 и более ранних версиях, и в Firefox.

type:

Указывает, какой тип элемента управления будет отображен. По умолчанию браузеры используют input type="text", если не указано другое или неизвестное значение атрибута type. Таким образом, браузеры, не поддерживающие новые значения, просто заменят их значением по умолчанию и отобразят обычное текстовое поле ввода.

• button - определяет активную кнопку (главным образом используется с JavaScript для активации скрипта).
• checkbox - определяет элементы управления флажки, которые могут быть либо установлены, либо сняты. Можно установить сразу несколько флажков или не устанавливать ни один из них. Это отличает флажки от радио-кнопок (type="radio").
• color - генерирует палитру цветов, давая возможность пользователям выбирать значения цветов в шестнадцатеричном формате.
• date - позволяет получить доступ к встроенному в браузер виджету выбора даты.
• datetime - определяет элемент управления датой и временем (год, месяц, день, час, минута, секунда и доли секунды, основанный на часовом поясе UTC).
• datetime-local - определяет элемент управления датой и временем (год, месяц, день, час, минуты, секунды и доли секунды (без часового пояса)).
• email - определяет поле для адреса электронной почты.
• file - определяет элемент управления с кнопкой "Обзор", для выбора и загрузки файлов.
• hidden - определяет скрытые поля ввода.
• image - определяет изображение, как кнопку для отправки.
• month - позволяет выбрать один месяц, после чего обеспечит ввод данных в виде года и месяца (например: 2014-05).
• number - определяет поле для ввода чисел.
• password - определяет поле для ввода пароля (замаскированные символы).
• radio - создает радио-кнопки, которые являются взаимоисключающими, если выбрать одну радио-кнопку, то все остальные становятся неактивными.
• range - создает элемент управления ползунок, диапазон ползунка по умолчанию - от 0 до 100. Для изменения диапазона используются атрибуты min и max с желаемыми значениями. Обратите внимание, что данный элемент управления не отображает текущее значение.
• reset - определяет кнопку сброс (сбрасывает все поля формы в значения по умолчанию).
• search - определяет текстовое поле для ввода строки поиска.
• submit - определяет кнопку "Отправить".
• tel - определяет поле для ввода телефонного номера.
• text - определяет однострочное текстовое поле (ширина по умолчанию составляет 20 символов).
• time - допускает ввод значений в 24-часовом формате, например: 12:34. В поддерживающих браузерах элемент управления отображается как числовое поле ввода со значением, изменяемым с помощью мыши, и допускает ввод только значений времени.
• url - определяет поле для ввода URL-адреса.
• week - позволяет выбрать одну неделю, после чего обеспечит ввод данных в формате года и недели (например: 2014-W15).

value:

Указывает значение элемента input, и используется по-разному для разных типов ввода:

• Для "button", "reset", и "submit" - определяет текст на кнопке
• Для "text", "password", "hidden" - определяет начальное (по умолчанию) значение поля ввода
• Для "checkbox", "radio", "image" - определяет значение, связанное с вводом (значение, которое передается при отправке)

Атрибут value не может использоваться с type="file", и обязательно должен присутствовать при type="checkbox" и type="radio".

width:

Определяет ширину элемента в пикселях, используется только с input type="image" (пример: width="100").

Тег input так же поддерживает и

form action="demo_form.asp" 
 Имя: input type="text" name="fname"br 
 Фамилия: input type="text" name="lname"br 
 input type="submit" value="Отправить" 
/form