Значение атрибута type для тега input по умолчанию определено как: Тег HTML поле для ввода, кнопка — Вебджем.рф

Содержание

Атрибуты input в HTML: Атрибут type.

В прошлом видео мы начали знакомство с формами в HTML. И поговорили о том, как добавляется форма на страницу сайта. Кроме этого мы начали разговор об атрибуте type тега <input>, и теперь знаем, как сделать текстовое поле.

Но с применением HTML-атрибута type для <input> мы можем создавать и другие поля с абсолютно разным назначением. Именно об этих возможностях мы поговорим в этом видео уроке.

Значений атрибута type довольно большое количество. И после этого видео мы сможем добавлять в форму чекбоксы, кнопки-картинки, поля ввода пароля, кнопки загрузки файлов, скрытые поля, кнопки сброса и кнопки отправки данных. То есть в одном видео уроке мы охватим довольно много возможностей, которые мы можем применять при выводе HTML формы на странице.

input type button

Именно такой синтаксис позволит добавить в форму кнопку. Только естественно должны присутствовать необходимые знаки и кавычки. То есть полный и правильный синтаксис кнопки будет выглядеть так:

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

input type reset

Данный синтаксис позволит нам добавить еще одну кнопку. В отличие от предыдущей, эта кнопка выполняет некое действие, а именно, сброс данных заполненных в форме. То есть если у нас есть форма с заполненными полями, не важно какими, мы можем с помощью такой кнопки осуществить сброс данных сразу во всех полях и вернуть значения к исходным.

Полный синтаксис кнопки сброса будет выглядеть следующим образом:

input type submit

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

Чтобы добавить кнопку отправки данных на страницу мы должны прописать следующий код внутри формы:

Но это не единственный вариант отправки данных формы.

input type image

C помощью значения image для атрибута type мы можем добавить в форму картинку, которая будет выполнят то же самое, что и кнопка отправки, то есть отправлять данные формы. Единственное отличие в том, что это уже будет не кнопка, а изображение. Картинка может быть совершенно любой, например нарисованная заранее кнопка отправки.

В этом случае синтаксис будет отличаться от обычной кнопки отправки тем, что будет отсутствовать параметр value но будет присутствовать параметр src.

Итак, с кнопками и отправкой данных мы разобрались. Что еще может позволить нам атрибут type тега <input>?

input type file

А может он позволить добавить еще одну интересную кнопку, которая существует для отправки файлов. Фактически с помощью такой кнопки мы указываем имя файла, который должен быть отправлен на сервер после нажатия на кнопку отправки данных.

В этом случае, пожалуй, самый простой синтаксис:

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

input type password

Кроме того если вспоминать о текстовых полях, то мы можем с помощью значения password указать специальное поле для ввода пароля. Оно отличается от обычного текстового поля тем, что вводимый текст отображается в виде звездочек или точек, чтобы никто не мог видеть вводимый пароль.

Такой код должен быть использован для вызова поля ввода пароля на странице.

Но и это еще не все значения атрибута type которые мы можем использовать при выводе формы.

input type checkbox

Значение checkbox позволяет добавить в форму чекбокс или флажок. Если говорить простым языком, то мы можем добавить возможность выбора нескольких вариантов из предложенных, с помощью проставления галочек. Наверняка Вы с таким когда-нибудь уже сталкивались, например, при участии в каком-нибудь опросе или при заполнении формы, где необходимо выбрать один или несколько вариантов ответов из предложенных, поставив чекбокс.

Что касается синтаксиса, то он довольно прост:

Естественно это самый минимум, который необходим для вывода чекбоксов.

input type radio

Значение radio не говорит о том, что мы будем слушать радио, и вообще это поле никак не связано с радио электроникой. Мы просто с помощью этого значения можем добавит в форму некую радио-кнопку, с помощью которой, опять же, будет осуществляться выбор варианта ответа из предложенных. Однако в отличие от чекбокса, в этом случае предоставляется возможность выбора только одного единственного варианта ответа. Так же часто может встречаться в различных опросах, но и в формах обратной связи тоже имеет место быть.

Синтаксис здесь также прост и логичен:

Хочу еще раз отметить, что это тот минимум, который необходим как в случае с радио кнопками, так и с чекбоксами. Кроме того желательно использовать параметр value, чтобы приходил именно тот ответ который выбрал пользователь, но об этом подробнее в видео уроке.

И последняя возможность с использованием атрибута type.

input type hidden

C использованием значения hidden мы можем добавить в форму пустое невидимое или скрытое поле, которое никак не отображается на странице вообще. Подобные скрытые поля используются для подстановки необходимых нам данных и впоследствии получения их вместе с остальными данными, которые будут заполнены пользователем. Все необходимые данные мы можем прописать в параметре

value. И тогда синтаксис такого поля чаще всего будет выглядеть таким образом:

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

Видео урок: Атрибуты input в HTML: Атрибут type.

HTML-справочник и другие материалы можно и нужно скачать здесь!

В следующий раз…

- Веб-технологии для разработчиков

`input`	Chrome Полная поддержка Да	Edge Полная поддержка 12	Firefox Полная поддержка 1	IE Полная поддержка Да	Opera Полная поддержка Да	Safari Полная поддержка 1	WebView Android Полная поддержка 1	Chrome Android Полная поддержка Да	Firefox Android Полная поддержка 4	Opera Android Полная поддержка Да	Safari iOS Полная поддержка 1	Samsung Internet Android Полная поддержка Да
`type="button"`	Chrome Полная поддержка 1	Edge Полная поддержка 12	Firefox Полная поддержка 1	IE Полная поддержка Да	Opera Полная поддержка Да	Safari Полная поддержка 1	WebView Android Полная поддержка Да	Chrome Android Полная поддержка 18	Firefox Android Полная поддержка 4	Opera Android Полная поддержка Да	Safari iOS Полная поддержка Да	Samsung Internet Android Полная поддержка 1.0
`type="checkbox"`	Chrome Полная поддержка Да	Edge Полная поддержка 12	Firefox Полная поддержка Да	IE Полная поддержка Да	Opera Полная поддержка Да	Safari Полная поддержка Да	WebView Android Полная поддержка Да	Chrome Android Полная поддержка Да	Firefox Android Полная поддержка 4	Opera Android Полная поддержка Да	Safari iOS Полная поддержка Да	Samsung Internet Android Полная поддержка Да
`type="color"`	Chrome Полная поддержка 20	Edge Полная поддержка 14	Firefox Полная поддержка 29 Полная поддержка 29 Замечания Firefox doesn't yet support inputs of type `color` on Windows Touch.	IE Нет поддержки Нет	Opera Полная поддержка 12	Safari Полная поддержка 12.1	WebView Android Полная поддержка 4.4	Chrome Android Полная поддержка 25	Firefox Android Полная поддержка 27	Opera Android Полная поддержка 12	Safari iOS Полная поддержка 12.2	Samsung Internet Android Полная поддержка 1.5
`type="date"`	Chrome Полная поддержка 20	Edge Полная поддержка 12	Firefox Полная поддержка 57	IE Нет поддержки Нет	Opera Полная поддержка 11	Safari Нет поддержки Нет Нет поддержки Нет Замечания The input type is recognized, but there is no date-specific control. See bug 119175.	WebView Android Полная поддержка Да	Chrome Android Полная поддержка Да	Firefox Android Полная поддержка 57	Opera Android Полная поддержка 11	Safari iOS Полная поддержка 5	Samsung Internet Android Полная поддержка Да
`type="datetime-local"`	Chrome Полная поддержка 20	Edge Полная поддержка 12	Firefox Нет поддержки Нет Нет поддержки Нет Замечания See bug 888320 and TPE DOM/Date time input types.	IE Нет поддержки Нет	Opera Полная поддержка 11	Safari Нет поддержки Нет Нет поддержки Нет Замечания The input type is recognized, but there is no date-specific control. See bug 200416.	WebView Android Полная поддержка Да	Chrome Android Полная поддержка Да	Firefox Android Полная поддержка Да	Opera Android Полная поддержка 11	Safari iOS Полная поддержка Да	Samsung Internet Android Полная поддержка Да
`type="email"`	Chrome Полная поддержка 5	Edge Полная поддержка 12	Firefox Полная поддержка Да	IE Полная поддержка 10	Opera Полная поддержка 11	Safari Полная поддержка Да	WebView Android ?	Chrome Android ?	Firefox Android Полная поддержка 4	Opera Android Полная поддержка Да	Safari iOS Полная поддержка 3.1 Полная поддержка 3.1 Замечания Doesn't do validation, but instead offers a custom 'email' keyboard, which is designed to make entering email addresses easier. Замечания The custom 'email' keyboard does not provide a comma key, so users cannot enter multiple email addresses. Замечания Automatically applies a default style of `opacity: 0.4` to disable textual `<input>` elements, including those of type 'email'. Other major browsers don't currently share this particular default style.	Samsung Internet Android ?
`type="file"`	Chrome Полная поддержка 1	Edge Полная поддержка 12	Firefox Полная поддержка 1 Полная поддержка 1 Замечания You can set as well as get the value of `HTMLInputElement.files` in all modern browsers; this was most recently added to Firefox, in version 57 (see bug 1384030).	IE Полная поддержка Да	Opera Полная поддержка 11	Safari Полная поддержка 1	WebView Android Полная поддержка Да	Chrome Android Полная поддержка Да	Firefox Android Полная поддержка 4	Opera Android Полная поддержка 11	Safari iOS Полная поддержка Да	Samsung Internet Android Полная поддержка Да
`type="hidden"`	Chrome Полная поддержка 1	Edge Полная поддержка 12	Firefox Полная поддержка 1	IE Полная поддержка Да	Opera Полная поддержка 2	Safari Полная поддержка 1	WebView Android Полная поддержка Да	Chrome Android Полная поддержка Да	Firefox Android Полная поддержка 4	Opera Android Полная поддержка Да	Safari iOS Полная поддержка Да	Samsung Internet Android Полная поддержка Да
`type="image"`	Chrome Полная поддержка Да	Edge Полная поддержка 12	Firefox Полная поддержка Да	IE Полная поддержка Да	Opera Полная поддержка Да	Safari Полная поддержка Да	WebView Android Полная поддержка Да	Chrome Android ?	Firefox Android Полная поддержка Да	Opera Android Полная поддержка Да	Safari iOS Полная поддержка Да	Samsung Internet Android ?
`x-moz-errormessage` attribute ЭкспериментальнаяУстаревшаяНестандартная	Chrome Нет поддержки Нет	Edge Нет поддержки Нет	Firefox Нет поддержки ? — 66	IE Нет поддержки Нет	Opera Нет поддержки Нет	Safari Нет поддержки Нет	WebView Android Нет поддержки Нет	Chrome Android Нет поддержки Нет	Firefox Android Нет поддержки ? — 66	Opera Android Нет поддержки Нет	Safari iOS Нет поддержки Нет	Samsung Internet Android Нет поддержки Нет
`type="month"`	Chrome Полная поддержка 20	Edge Полная поддержка 12	Firefox Нет поддержки Нет Нет поддержки Нет Замечания See bug 888320.	IE Нет поддержки Нет	Opera Полная поддержка 11	Safari Нет поддержки Нет Нет поддержки Нет Замечания The input type is recognized, but there is no month-specific control. See bug 200416.	WebView Android Полная поддержка Да	Chrome Android Полная поддержка Да	Firefox Android Нет поддержки Нет	Opera Android Полная поддержка Да	Safari iOS Полная поддержка Да	Samsung Internet Android Полная поддержка Да
`type="number"`	Chrome Полная поддержка Да	Edge Полная поддержка 12	Firefox Полная поддержка Да	IE Полная поддержка 10	Opera Полная поддержка Да	Safari Полная поддержка Да	WebView Android Полная поддержка Да	Chrome Android Полная поддержка Да	Firefox Android Полная поддержка Да	Opera Android Полная поддержка Да	Safari iOS Полная поддержка Да	Samsung Internet Android Полная поддержка Да
`type="password"`	Chrome Полная поддержка 1	Edge Полная поддержка 12	Firefox Полная поддержка 1	IE Полная поддержка 2	Opera Полная поддержка 2	Safari Полная поддержка 1	WebView Android ?	Chrome Android Полная поддержка Да	Firefox Android Полная поддержка 4	Opera Android Полная поддержка Да	Safari iOS Полная поддержка Да	Samsung Internet Android Полная поддержка Да
`type="radio"`	Chrome Полная поддержка Да	Edge Полная поддержка 12	Firefox Полная поддержка Да	IE Полная поддержка Да	Opera Полная поддержка Да	Safari Полная поддержка Да	WebView Android Полная поддержка Да	Chrome Android Полная поддержка Да	Firefox Android Полная поддержка 4	Opera Android Полная поддержка Да	Safari iOS Полная поддержка Да	Samsung Internet Android Полная поддержка Да
`type="range"`	Chrome

НОУ ИНТУИТ | Лекция | HTML-формы

Аннотация: В этой лекции разбирается возможность взаимодействия читателя HTML-страниц с сервером Web-узла. Подробно описывается подмножество HTML, которое носит название HTML-формы.

HTML-формы

Формы были созданы и используются в WWW для получения отклика пользователя на предоставленную информацию и сбора данных о пользователе. После заполнения пользователем формы и запуска процесса ее обработки, информация из нее попадает к программе, работающей на сервере. Простота использования тега <MAILTO:> в формах позволяет даже владельцам небольших страниц получать отклик от своих читателей. Для обработки большого количества откликов используются программы, поддерживающие Common Gateway Interface (CGI) и расположенные на сервере, в адрес которого поступают отклики. Таким образом пользователь может интерактивно взаимодействовать с Web-сервером через Internet.

Задание формы — элемент FORM

Элемент FORM обозначает документ как форму и определяет границы использования других тегов, размещаемых в форме. Тег <FORM> определяется последовательностью тегов <INPUT> , размещенных внутри пары <FORM> и </FORM>. В форме используется как метод ( method ), так и действие ( action ) для описания обработки данных, вводимых пользователем в форму. Метод ( GET или POST ) определяет, как должны обрабатываться входные данные из формы, а действие указывает на URI (Uniform Resource Identifier) программы, ответственной за обработку этих данных.

<FORM METHOD=post 
 ACTION=mailto:[email protected]>

Определение элементов управления формы — тег <INPUT>

Данный тег используют для определения области внутри формы, куда вводятся данные. Он формирует поле для ввода информации пользователем. Это может быть текстовое поле, опция, изображение или кнопка. Вид поля ввода определяется значением атрибута TYPE.

Атрибут TYPE=text

Когда пользователю необходимо ввести небольшое количество текста (одну или несколько строк), используется тег <INPUT> , и атрибут TYPE устанавливается в значение text. Это значение принято по умолчанию и указывать его необязательно. Кроме того, задается атрибут NAME для определения наименования переменной поля.

Ваше имя <INPUT NAME=Name SIZE=35>

Имеется еще три дополнительных атрибута, которые можно использовать. Первый называется MAXLENGTH, он ограничивает число символов, вводимых пользователем в текущее поле. По умолчанию данное число не ограничено. Вторым атрибутом является SIZE, определяющий размер видимой на экране области, занимаемой текущим полем. Значение по умолчанию определяется типом браузера. Если значение MAXLENGTH больше, чем SIZE, браузер будет прокручивать данные в окне. Последним из дополнительных атрибутов является атрибут VALUE, обеспечивающий начальное значение поля ввода.

Атрибут TYPE=checkbox

Для создания независимых флагов в формах HTML используется тег <INPUT> со значением атрибута TYPE=checkbox. В зависимости от содержания формы пользователь может отметить несколько флагов. Когда форма использует тег <INPUT> со значением атрибута CHECKBOX, в нем должны присутствовать и атрибуты NAME, и VALUE. Атрибут NAME указывает на наименование данного поля (флага) ввода. В атрибуте VALUE будет содержаться значение поля.

<BR>Россия<INPUT NAME="Страна" TYPE=checkbox 
VALUE="Россия">
Страны СНГ<INPUT NAME="Страна" TYPE=checkbox 
VALUE="СНГ">

В некоторых случаях необходимо инициализировать данный флаг, как уже отмеченный. В таких случаях тег <INPUT> должен содержать атрибут CHECKED.

Атрибут TYPE=radio

В некоторых случаях требуется организовать выбор одного из нескольких возможных значений. Для создания формы ввода при выборе пользователем одного значения из нескольких возможных необходимо использовать тег <INPUT> с атрибутом TYPE=radio. Когда в форме применяется данный атрибут, в теге <INPUT> должны быть указаны атрибуты NAME и VALUE. Атрибут NAME указывает наименование соответствующего поля (кнопки). Атрибут VALUE содержит значение поля.

<BR>Пол мужской<INPUT NAME="Пол" TYPE=radio 
VALUE="Мужской">
Пол женский<INPUT NAME="Пол" TYPE=radio 
VALUE="Женский">

Атрибут TYPE=image

В зависимости от содержимого формы может случиться так, что пользователю потребуется щелкнуть мышью на изображении, чтобы завершить работу с формой. Для этого программисты используют тег <INPUT> с атрибутом TYPE=image. Когда пользователь щелкает мышью по изображению, браузер сохраняет координаты соответствующей точки экрана. Далее он "обрабатывает" введенную в форму информацию. Когда форма использует атрибут image, тег <INPUT> должен содержать также атрибуты NAME и SRC. NAME указывает наименование поля ввода формы. Атрибут SRC содержит URI файла — источника изображения. Атрибут ALIGN является дополнительным и используется аналогично тому же атрибуту тега <IMG>.

<BR>Выберите точку<INPUT TYPE=image NAME=point 
SRC=image.gif>

Атрибут TYPE=password

Если в форме требуется организовать ввод пароля, то атрибут TYPE можно установить в значение password ( TYPE=password ). Используя данный тип, можно организовать ввод пароля без вывода на экран составляющих его символов. При этом следует помнить, что введенные данные передаются по незащищенным каналам связи и могут быть перехвачены.

<BR>Подпись<INPUT NAME=login>Пароль
<INPUT TYPE=password NAME="Слово">

Атрибут TYPE=reset

Когда пользователь заполняет форму, ему может потребоваться начать все сначала. На такой случай существует кнопка Reset, по которой пользователь может щелкнуть мышью, чтобы вернуться к первоначальным значениям полей. Когда пользователь выбирает данную кнопку, форма восстанавливает первоначальные значения всех элементов, в которых присутствует атрибут TYPE=reset. Для создания кнопки Reset используется тег <INPUT> с атрибутом TYPE=reset. Браузер в свою очередь будет выводить изображение данной кнопки. Если в форме используется атрибут reset, тег <INPUT> может дополнительно содержать атрибут VALUE. Данный атрибут определяет надпись на изображении кнопки.

<INPUT TYPE=reset VALUE="Очистить форму">

Атрибут TYPE=submit

Используя форму HTML для ввода информации от пользователя, необходимо обеспечить пользователю возможность завершить ввод данных. Для этого используется тег <INPUT> с атрибутом TYPE=submit. Браузер, в свою очередь, выводит данный элемент, как кнопку, по которой пользователь может щелкнуть, чтобы завершить процесс редактирования. Когда в форме используется тег <INPUT> с атрибутом submit, данный элемент может содержать два дополнительных атрибута: NAME и VALUE. Атрибут NAME хранит название переменной поля в вашей форме. Атрибут VALUE — определяет значение элемента формы, которое будет отправлено на сервер или получено с помощью клиентских скриптов.

<BR><INPUT TYPE=submit 
VALUE="Отправить сообщение">

Атрибут TYPE=hidden

Скрытые поля. Добавление в тег INPUT атрибута TYPE=hidden позволит включить в отправляемую форму значения атрибутов NAME и VALUE, которые пользователь изменить не может. Такие метки полезны при наличии нескольких форм для дальнейшей обработки данных.

Атрибут formtarget тега | HTML справочник

HTML тег <input>

Значение и применение

Атрибут formtarget (HTML тега <input>) задаёт браузеру, где показать ответ, полученный после отправки формы (вкладка, текущее окно, или фрейм). По умолчанию установлено значение _self - отображает ответ в текущем окне. Атрибут используется только для <input type = "image" и <input type = "submit">.

Обращаю Ваше внимание, что если атрибут formtarget используется, то он переопределяет значение атрибута target элемента <form>.

Поддержка браузерами

Синтаксис:

<input formtarget = "_blank | _self | _parent | _top | framename">

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

Значение	Описание
_blank	Ответ будет отображен в новом окне или вкладке
_self	Ответ отображается в том же окне. Это значение по умолчанию.
_parent	Отображает ответ во фрейм родителе, если фреймов нет, то это значение работает как _self.
_top	Загружает ответ в полном исходном окне, и отменяет все остальные фреймы. Если нет родителей, то ведет себя точно так же, как _self.
framename	Ответ отображается в окне <iframe> с указаным именем.

Отличия HTML 4.01 от HTML 5

Атрибут formtarget считается новым в HTML 5.

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

<!DOCTYPE html>
<html>
	<head>
		<title>Использование атрибута formtarget HTML тега <input></title>
	</head>
	<body>
		<form id = "subscribeForm"> <!-- определяем id для нашей формы -->
			Имя: <input type = "text" name = "userName"> <!-- определяем элемент управления для ввода текстовой информации -->
			E-mail: <input type = "email" name = "email"> <!-- определяем элемент управления для ввода адреса электронной почты -->
			<input type = "submit" value = "Подписаться" formaction = "script.php" formtarget = "_blank"> <!-- определяем элемент управления для отправки формы -->
		</form>
	</body>
</html>

В данном примере мы создали форму (HTML тег <form>), глобальным атрибутом id указали для неё идентификатор. Внутри формы мы поместили элементы управления <input>, которые позволяют пользователю ввести логин, адрес электронной почты и отправить нашу форму. Для элемента управления, предназначенного для отправки формы (type = "submit") мы указали:

Атрибутом formaction указали URL файла, который будет обрабатывать (контролировать) входную информацию после отправки формы (script.php).
Атрибутом formtarget указали, что ответ будет отображен в новом окне ("_blank").

Результат нашего примера:

Пример использования атрибута formtarget HTML тега <input>. HTML тег <input>

Атрибут enctype | htmlbook.ru

Internet Explorer	Chrome	Opera	Safari	Firefox	Android	iOS
3.0+	1.0+	4.0+	1.0+	1.0+	1.0+	1.0+

Спецификация

HTML:

3.2

4.01

5.0

XHTML:

1.0

1.1

Описание

Определяет способ кодирования данных формы при их отправке на сервер. Обычно устанавливать значение атрибута enctype не требуется, данные вполне правильно понимаются на стороне сервера. Однако если используется поле для отправки файла (input type="file"), следует определить атрибут enctype как multipart/form-data.

Синтаксис

<form enctype="application/x-www-form-urlencoded | multipart/form-data | text/plain">
...
</form>

Значения

application/x-www-form-urlencoded: Вместо пробелов ставится +, символы вроде русских букв кодируются их шестнадцатеричными значениями (например, %D0%90%D0%BD%D1%8F вместо Аня).
multipart/form-data: Данные не кодируются. Это значение применяется при отправке файлов.
text/plain: Пробелы заменяются знаком +, буквы и другие символы не кодируются.

Обязательный атрибут

Нет.

Значение по умолчанию

application/x-www-form-urlencoded

Пример

HTML5IECrOpSaFx

<!DOCTYPE HTML>
<html>
 <head>
  <meta charset="utf-8">
  <title>Тег FORM, атрибут enctype</title>
 </head>
 <body>  
  <form action="handler.php"
   enctype="multipart/form-data" method="post">
   <p>Загрузите файл с картинкой</p>
   <p><input type="file" name="pic"></p>
  </form>
 </body>
</html>

Результат данного примера показан на рис. 1.

Рис. 1. Поле для отправки файла

Не выкладывайте свой код напрямую в комментариях, он отображается некорректно. Воспользуйтесь сервисом cssdeck.com или jsfiddle.net, сохраните код и в комментариях дайте на него ссылку. Так и результат сразу увидят.

Входное значение HTML Атрибут

❮ HTML-тег

Пример

HTML-форма с начальными (по умолчанию) значениями:

<форма action = "/ action_page.php">
Имя:

Последняя name:

Попробуй сам "

Определение и использование

Атрибут value указывает значение элемента .

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

Для «кнопка», «сброс» и «отправить» - это определяет текст на кнопке
Для «текста», «пароля» и «скрытого» - определяет начальное (по умолчанию) значение поля ввода
Для «флажок», «радио», «изображение» - оно определяет значение, связанное со входом (это также значение, которое отправляется при отправке)

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

Поддержка браузера

Числа в таблице указывают первую версию браузера, которая полностью поддерживает атрибут.

Атрибут
значение	Да	Да	Да	Да	Да

Синтаксис

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

Значение	Описание
текст	Указывает значение элемента

Tag HTML-тег ,

атрибутов ввода HTML

В этой главе описываются различные атрибуты для элемента HTML .

Атрибут значения

Атрибут входного значения указывает начальное значение для поля ввода:

Пример

Поля ввода с начальными (по умолчанию) значениями:

<форма>
Имя:

Последний name:

Попробуй сам "

Атрибут только для чтения

Атрибут input readonly указывает, что поле ввода доступно только для чтения.

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

Значение поля ввода только для чтения будет отправлено при отправке формы!

Пример

Поле ввода только для чтения:

<форма>
Имя:

Last name:

Попробуй сам "

Атрибут отключен

Атрибут отключенного ввода указывает, что поле ввода должно быть отключено.


 Отключенное поле ввода невозможно использовать и его нельзя щелкнуть. 
 Значение отключенного поля ввода не будет отправлено при отправке формы! 
 Пример 
 Отключенное поле ввода: 

<форма> 

 Имя:  
 
  
 
  Последний
name:  
 
  
 

Попробуй сам "


 Атрибут размера 
 Атрибут input  size  определяет
видимая ширина, в символах, поля ввода.
 Значение по умолчанию для  размера  - 20. 
  Примечание:  Атрибут  size 
работает со следующими типами ввода: текст, поиск, тел, URL, электронная почта и
пароль. 
 Пример 
 Установите ширину поля ввода: 

 
  Имя:  
 
  
 
  PIN:  
 
  
  
Попробуй сам "

 Атрибут maxlength 
 Атрибут input  maxlength  указывает максимально допустимое количество символов в поле ввода.
  Примечание:  Если задана максимальная длина  , поле ввода не будет принимать больше, чем
указанное количество символов. Однако этот атрибут не предоставляет никакой обратной связи.
Итак, если вы хотите предупредить пользователя,
Вы должны написать код JavaScript. 

 Пример 
 Установите максимальную длину для поля ввода: 

 
  Имя:  
 
  
 
  PIN:  
 
  
  
Попробуй сам "

 Атрибуты min и max 
 Входные атрибуты  min  и  max  определяют минимальное и максимальное значения для
поле ввода.
 Атрибуты  мин.  и  макс.  работают со следующими типами ввода: число, диапазон, дата, дата-время-местный, месяц, время и неделя. 
  Совет:  Используйте атрибуты max и min вместе, чтобы создать
диапазон правовых ценностей. 
 Пример 
 Установите максимальную дату, минимальную дату и диапазон допустимых значений: 

 Введите дату раньше
1980-01-01: 
   Введите дату
после 2000-01-01:  
  
 
 
  <метка для = "количество"> Количество
(от 1 до 5):  
  
  
Попробуй сам "

 Множественный атрибут 
 Атрибут input  множественный  указывает, что пользователю разрешено вводить более одного значения в
поле ввода.
 Атрибут  множественный  работает со следующими типами ввода: электронная почта и файл. 
 Пример 
 Поле загрузки файла, которое принимает несколько значений: 

 
  Выбрать файлы:  
  
  
Попробуй сам "

 Атрибут шаблона 
 Атрибут входного  шаблона  указывает регулярное выражение, которое
Значение поля ввода проверяется при отправке формы.
 Атрибут  pattern  работает со следующими типами ввода: текст,
дата, поиск, URL, телефон, электронная почта и пароль. 
  Подсказка:  Используйте атрибут глобального заголовка, чтобы описать шаблон, который поможет пользователю. 
  Подсказка:  Узнайте больше о регулярных выражениях в нашем руководстве по JavaScript. 
 Пример 
 Поле ввода, которое может содержать только три буквы (без цифр или специальных
символы): 

 
  Код страны:  


pattern = "[A-Za-z] {3}" title = "Трехбуквенный код страны"> 
  
Попробуй сам "

 Атрибут-заполнитель 
 Атрибут input  placeholder  указывает
короткая подсказка, которая описывает ожидаемое значение поля ввода (примерное значение или краткое описание
ожидаемый формат).
 Короткая подсказка отображается в поле ввода перед тем, как пользователь вводит
стоимость. 
 Атрибут-заполнитель   работает со следующими типами ввода: текст, поиск, URL, телефон, электронная почта и пароль. 
 Пример 
 Поле ввода с заполнителем текста: 

 
  Введите номер телефона:  


placeholder = "123-45-678" 
 pattern = "[0-9] {3} - [0-9] {2} - [0-9] {3}"> 

 
Попробуй сам "

 Требуемый атрибут 
 Атрибут input  required  указывает, что поле ввода должно быть заполнено перед отправкой формы.
 Атрибут  требуется  работает со следующими типами ввода: текст, поиск, URL, телефон, электронная почта, пароль, указатели даты, номер, флажок, радио и файл. 
 Пример 
 Обязательное поле ввода: 

 
  Имя пользователя:  
  
  
Попробуй сам "

 Атрибут шага 
 Атрибут ввода  step  определяет допустимые интервалы номеров для
поле ввода.
 Пример: если step = "3", допустимые номера могут быть -3, 0, 3, 6 и т. Д. 
  Подсказка:  Этот атрибут может использоваться вместе с атрибутами max и min для создания диапазона допустимых значений. 
 Атрибут  step  работает со следующими типами ввода: число, диапазон, дата, дата, время, местность, месяц, время и неделя. 
 Пример 
 Поле ввода с указанными допустимыми номерами интервалов: 

 
  Points:  
  
  
Попробуй сам "
  Примечание:  Ограничения ввода не являются надежными, и JavaScript предоставляет множество способов
добавить незаконный ввод.Чтобы безопасно ограничить ввод, он также должен быть проверен приемником
(сервер)!


 Атрибут автофокуса 
 Атрибут input  autofocus  указывает, что
поле ввода должно автоматически получить фокус при загрузке страницы. 
 Пример 
 Пусть поле ввода «Имя» автоматически получает фокус при загрузке страницы: 

 
  Имя:  
 
  
 
  Last
name:  
 
  

 
Попробуй сам "

 Высота и ширина Атрибуты 
 Атрибуты input  height  и  width  определяют высоту и ширину    элемент.
  Совет:  Всегда указывайте атрибуты высоты и ширины для
изображений. Если заданы высота и ширина, пространство, необходимое для изображения
зарезервировано, когда страница загружена. Без этих атрибутов браузер не
знать размер изображения и не может зарезервировать для него подходящее место.
эффект будет в том, что макет страницы будет меняться во время загрузки (пока изображения
нагрузка). 
 Пример 
 Определите изображение как кнопку отправки с атрибутами высоты и ширины: 

 
  Имя:  
  
 
 
  Последний
name:  
  
 
 



  
Попробуй сам "

 Атрибут списка 
 Атрибут входного  списка  относится к элементу   , который содержит предопределенные параметры для элемента . 
 Пример 
 Элемент  с предопределенными значениями в : 

<форма> 

 

 


Попробуй сам "

 Атрибут автозаполнения 
 Атрибут  автозаполнения ввода  указывает, будет ли форма или
В поле ввода должно быть включено или выключено автозаполнение.
 Автозаполнение позволяет браузеру прогнозировать значение. Когда пользователь начинает
введите поле, браузер должен отображать параметры для заполнения поля, основанные на
на ранее введенных значениях. 
 Атрибут  автозаполнения  работает с    и
следующие    типов: текст, поиск, URL, телефон, электронная почта, пароль, указатели даты, диапазон и цвет. 

 Пример 
 Форма HTML с включенным и выключенным автозаполнением для одного поля ввода: 

 
  First
name:  
  
 
 

 Фамилия:  
  
 
 
  Электронная почта:  

 
 
 

 
 

Попробуй сам "
  Совет:  В некоторых браузерах может потребоваться активировать
функция автозаполнения, чтобы это работало (см. «Настройки» в
меню браузера).

 HTML Упражнения 
 Проверьте себя с помощью упражнений 
 Упражнение: 
 В поле ввода ниже добавьте заполнитель с надписью «Ваше имя здесь». 











Отправить ответ »
 Начните упражнение 

 HTML-форма и элементы ввода 


 Tag 
 Описание 


 <форма> 
 Определяет форму HTML для пользовательского ввода 


  
 Определяет элемент управления вводом 




, HTML-тег ввода 






 Пример 
 HTML-форма с тремя полями ввода; два текстовых поля и одна кнопка отправки: 

<форма
action = "/ action_page.php"> 

 Имя:  
  
 
 

 Фамилия:  
  
 
 

 



Попробуй сам »


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

    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    (значение по умолчанию) 
    
    
    

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

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

 Поддержка браузера 


 Элемент 







 <вход> 
 Да 
 Да 
 Да 
 Да 
 Да 




 атрибутов 


 Атрибут 
 Значение 
 Описание 


 принять 
  file_extension  

аудио / * 

видео / * 

изображение / * 

 media_type  
 Указывает фильтр для типов файлов, которые пользователь может выбрать из файла.
диалоговое окно ввода (только для type = "file") 


 альт 
  текст  
 Указывает альтернативный текст для изображений (только для type = "image") 


 автозаполнение 
 по 

выкл 
 Указывает, должен ли элемент  включать автозаполнение. 


 автофокус 
 автофокус 
 Указывает, что элемент  должен автоматически получать фокус при загрузке страницы. 


 проверено 
 проверено 
 Указывает, что элемент  должен быть предварительно выбран при загрузке страницы (для type = "checkbox" или type = "radio") 


 dirname 
  входное имя .реж. 
 Указывает, что направление текста будет отправлено 


 отключен 
 отключен 
 Указывает, что элемент  должен быть отключен. 


 форма 
  form_id  
 Указывает форму, которой принадлежит элемент  


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


 formenctype 
 заявка / x-www-form-urlencoded 

multipart / form-data 

текст / простой 
 Указывает, как данные формы должны быть закодированы при отправке их на сервер (для type = "submit" и type = "image") 


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


 Formnovalidate 
 Formnovalidate 
 Определяет, что элементы формы не должны проверяться при отправке 


 форма цели 
 _blank 

_self 

_parent 

_top 

 имя  
 Указывает, где отображать ответ, полученный после отправки формы (для type = "submit" и type = "image") 


 высота 
  пикселей  
 Указывает высоту элемента  (только для type = "image") 


 список 
  datalist_id  
 Относится к элементу , который содержит предопределенные параметры для элемента  


 макс. 
  номер 

дата  
 Указывает максимальное значение для элемента  


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


 мин. 
  номер 

дата  
 Указывает минимальное значение для элемента  


 длина 
  номер  
 Указывает минимальное количество символов, необходимое для элемента  


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


  имя 
  текст  
 Указывает имя элемента  


 шаблон 
  регулярное выражение  
 Указывает регулярное выражение, по которому значение элемента  проверяется по 


 заполнитель 
  текст  
 Указывает краткую подсказку, которая описывает ожидаемое значение элемента  


 только для чтения 
 только для чтения 
 Указывает, что поле ввода доступно только для чтения. 


 требуется 
 требуется 
 Указывает, что поле ввода должно быть заполнено перед отправкой формы 


 размер 
  номер  
 Указывает ширину в символах элемента  


 SRC 
  URL  
 Указывает URL-адрес изображения для использования в качестве кнопки отправки (только для
type = "image") 


 шаг 

 номер 
  любой 
 Указывает интервал между юридическими числами в поле ввода 


 тип 
 кнопка 

флажок 

цвет 

дата 

datetime-local 

электронная почта 

файл 

скрытый 

изображение 

месяц 

номер 

пароль 

радио 

диапазон 

сброс 

поиск 

отправить 

тел 

текст 

время 

URL 

неделя 
 Указывает элемент типа  для отображения 


 значение 
  текст  
 Указывает значение элемента   

 


 ширина 
  пикселей  
 Указывает ширину элемента  (только для type = "image") 



 глобальных атрибутов 
 Тег    также поддерживает глобальные атрибуты в HTML.


 Атрибуты события 
 Тег    также поддерживает атрибуты событий в HTML. 


 Связанные страницы 
 Учебник HTML: 
 HTML DOM ссылка: 

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


, типов ввода HTML 





 В этой главе описываются различные типы для элемента HTML   . 

 Типы ввода HTML 
 Вот различные типы ввода, которые вы можете использовать в HTML: 

    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    


 Тип ввода текста 
    определяет 
однострочное поле ввода текста : 
 Пример 

<форма> 

 Имя:  
 
  
 
  Последний
name:  
 
  



Попробуй сам "
 Вот как HTML-код выше будет отображаться в браузере: 
Имя: 



Фамилия: 




 Тип ввода Пароль 
    определяет поле пароля  : 
 Пример 

<форма> 

 Имя пользователя:  
 
  
 
  Пароль:  
 

 



Попробуй сам "
 Вот как HTML-код выше будет отображаться в браузере: 
Имя пользователя: 



Пароль: 

 Символы в поле пароля маскируются (отображаются в виде звездочек или кружков).


 Тип ввода Отправить 
    определяет кнопку для 
отправка данных формы  обработчику форм  . 
 Обработчик форм - это обычно страница сервера со скриптом для обработки
входные данные. 
 Обработчик формы указан в действии  формы 
атрибут: 
 Пример 

 
  Сначала
name:  
 
  
 
  Фамилия:  
 

 
 
 

 
 

Попробуй сам "
 Вот как HTML-код выше будет отображаться в браузере: 
 Если вы опустите атрибут значения кнопки отправки, кнопка получит текст по умолчанию: 
 Пример 

 
  First
name:  
 
  
 
  Фамилия:  
 

 
 
 

 
 

Попробуй сам "

 Тип входа Сброс 
    определяет кнопку сброса  
это сбросит все значения формы к их значениям по умолчанию: 
 Пример 

 
  First
name:  
 
  
 
  Фамилия:  
 

 
 
 

 
  
 

Попробуй сам "
 Вот как HTML-код выше будет отображаться в браузере: 
 Если вы измените входные значения и затем нажмете кнопку «Сброс», данные формы будут сброшены до значений по умолчанию.

 Тип входа Радио 
    определяет радиокнопку  . 
 Радиокнопки позволяют пользователю выбрать ТОЛЬКО ОДИН из ограниченного числа вариантов: 
 Пример 

 
  
  Male  
 
  
 <метка
for = "female"> Female  
 
  
 <метка для = "другое"> другое  
 

Попробуй сам "
 Вот как HTML-код выше будет отображаться в браузере: 
Мужской 

Женский 

Другой

 Тип входа Флажок 
    определяет  флажок .
 Флажки позволяют пользователю выбирать НОЛЬ или БОЛЬШЕ вариантов из ограниченного числа вариантов. 
 Пример 

 
  

 У меня есть велосипед  
 
  
 <метка для = "vehicle2">
У меня есть машина  
 
  
  У меня есть лодка  



Попробуй сам "
 Вот как HTML-код выше будет отображаться в браузере: 
У меня есть велосипед 

У меня есть машина 

У меня есть лодка

 Кнопка ввода типа 
    определяет кнопку  : 
 Пример 

 
Попробуй сам "
 Вот как HTML-код выше будет отображаться в браузере: 

 Тип входа Цвет 
    используется для полей ввода, которые должны содержать цвет.
 В зависимости от поддержки браузера в поле ввода может отображаться палитра цветов. 
 Пример 

 
  Выберите ваш любимый
цвет:  
  

 
Попробуй сам "

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

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

 
  Введите дату до
1980-01-01:  
  
 
 
  Введите дату после
2000-01-01:  
  
  
Попробуй сам "

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

 
  День рождения (дата и
время):  
  

 
Попробуй сам "

 Тип входа Электронная почта 
    используется для полей ввода, которые должны содержать адрес электронной почты.
 В зависимости от поддержки браузера адрес электронной почты может автоматически проверяться при отправке. 
 Некоторые смартфоны распознают тип электронной почты и добавляют «.com» к клавиатуре, чтобы соответствовать вводу электронной почты. 
 Пример 

 
  Введите адрес электронной почты:  

 

 
Попробуй сам "

 Тип файла ввода 
   
определяет поле выбора файла и кнопку «Обзор» для загрузки файла.
 Пример 

 
  Выберите файл:  

 
  
Попробуй сам "

 Тип ввода Месяц 
    позволяет пользователю выбрать месяц и год. 
 В зависимости от поддержки браузера в поле ввода может отображаться средство выбора даты. 
 Пример 

 
  День рождения (месяц и
год):  
  

 
Попробуй сам "

 Тип ввода Номер 
    определяет 
числовое поле ввода .
 Вы также можете установить ограничения на то, какие номера принимаются. 
 В следующем примере показано числовое поле ввода, где вы можете ввести значение от 1 до 5: 
 Пример 

<форма> 
 <метка для = "количество"> количество (от 1 до
5):  
 <тип ввода = "число" имя = "количество"
min = "1" max = "5"> 
  
Попробуй сам "

 Ограничения на ввод 
 Вот список некоторых общих ограничений ввода: 
.

Значение 

 Атрибут 
 Описание 


 проверено 
 Указывает, что поле ввода должно быть предварительно выбрано при загрузке страницы (для type = "checkbox" или type = "radio") 


 инвалидов 
 Указывает, что поле ввода должно быть отключено. 


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


 максимальная длина 
 Указывает максимальное количество символов для поля ввода 


 мин 
 Указывает минимальное значение для поля ввода 


 шаблон 
 Задает регулярное выражение для проверки входного значения по сравнению с 

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


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


 размер 
 Указывает ширину (в символах) поля ввода 


 шаг 
 Указывает допустимые интервалы номеров для поля ввода 

 
 Указывает значение по умолчанию для поля ввода 



Вы узнаете больше об ограничениях ввода в следующей главе.

В следующем примере показано числовое поле ввода, где вы можете ввести
значение от 0 до 100 с шагом 10. Значение по умолчанию: 30: 
 Пример 

<форма> 
 <метка для = "количество"> количество:  
 <вход
тип = "число" имя = "количество" мин = "0" макс = "100" шаг = "10"
значение = "30"> 
  
Попробуй сам "

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

 
  Объем (от 0 до 50):  

 

 
Попробуй сам "

 Тип ввода Поиск 
    используется для полей поиска (поле поиска ведет себя как обычное текстовое поле).
 Пример 

 
  Поиск в Google:  

 

 
Попробуй сам "

 Тип входа Тел 
    используется для полей ввода, которые должны содержать номер телефона. 
 Пример 

 
  Введите свой номер телефона:  

 
  
Попробуй сам "

 Тип ввода Время 
    позволяет пользователю выбрать время (без часового пояса).
 В зависимости от поддержки браузера в поле ввода может отображаться указатель времени. 
 Пример 

 
  Выберите время:  

 

 
Попробуй сам "

 Тип входа Url 
    используется для полей ввода, которые должны содержать URL-адрес. 
 В зависимости от поддержки браузера, поле URL может быть автоматически проверено
когда подано.
 Некоторые смартфоны распознают тип URL и добавляют «.com» к клавиатуре для соответствия
URL-адрес. 
 Пример 

 
  Добавьте свою домашнюю страницу:  

 

 
Попробуй сам "

 Тип ввода Неделя 
    позволяет пользователю выбрать неделю и год. 
 В зависимости от поддержки браузера в поле ввода может отображаться средство выбора даты.
 Пример 

 
  Выберите неделю:  

 

 
Попробуй сам "

 HTML Упражнения 
 Проверьте себя с помощью упражнений 
 Упражнение: 
 В приведенной ниже форме добавьте поле ввода для текста с именем «username». 




<>






Отправить ответ »
 Начните упражнение 

 Атрибут типа ввода HTML 


,

Tag	Описание
<форма>	Определяет форму HTML для пользовательского ввода
	Определяет элемент управления вводом

Атрибут	Значение	Описание
принять	file_extension аудио / * видео / * изображение / * media_type	Указывает фильтр для типов файлов, которые пользователь может выбрать из файла. диалоговое окно ввода (только для type = "file")
альт	текст	Указывает альтернативный текст для изображений (только для type = "image")
автозаполнение	по выкл	Указывает, должен ли элемент включать автозаполнение.
автофокус	автофокус	Указывает, что элемент должен автоматически получать фокус при загрузке страницы.
проверено	проверено	Указывает, что элемент должен быть предварительно выбран при загрузке страницы (для type = "checkbox" или type = "radio")
dirname	входное имя .реж.	Указывает, что направление текста будет отправлено
отключен	отключен	Указывает, что элемент должен быть отключен.
форма	form_id	Указывает форму, которой принадлежит элемент
formaction	URL	Указывает URL-адрес файла, который будет обрабатывать элемент управления вводом при отправке формы (для type = "submit" и type = "image")
formenctype	заявка / x-www-form-urlencoded multipart / form-data текст / простой	Указывает, как данные формы должны быть закодированы при отправке их на сервер (для type = "submit" и type = "image")
Formmethod	получить пост	Определяет метод HTTP для отправки данных по URL-адресу действия (для type = "submit" и type = "image")
Formnovalidate	Formnovalidate	Определяет, что элементы формы не должны проверяться при отправке
форма цели	_blank _self _parent _top имя	Указывает, где отображать ответ, полученный после отправки формы (для type = "submit" и type = "image")
высота	пикселей	Указывает высоту элемента (только для type = "image")
список	datalist_id	Относится к элементу , который содержит предопределенные параметры для элемента
макс.	номер дата	Указывает максимальное значение для элемента
максимальная длина	номер	Указывает максимально допустимое количество символов в элементе
мин.	номер дата	Указывает минимальное значение для элемента
длина	номер	Указывает минимальное количество символов, необходимое для элемента
кратный	кратный	Указывает, что пользователь может ввести более одного значения в элементе
имя	текст	Указывает имя элемента
шаблон	регулярное выражение	Указывает регулярное выражение, по которому значение элемента проверяется по
заполнитель	текст	Указывает краткую подсказку, которая описывает ожидаемое значение элемента
только для чтения	только для чтения	Указывает, что поле ввода доступно только для чтения.
требуется	требуется	Указывает, что поле ввода должно быть заполнено перед отправкой формы
размер	номер	Указывает ширину в символах элемента
SRC	URL	Указывает URL-адрес изображения для использования в качестве кнопки отправки (только для type = "image")
шаг	номер любой	Указывает интервал между юридическими числами в поле ввода
тип	кнопка флажок цвет дата datetime-local электронная почта файл скрытый изображение месяц номер пароль радио диапазон сброс поиск отправить тел текст время URL неделя	Указывает элемент типа для отображения
значение	текст	Указывает значение элемента
ширина	пикселей	Указывает ширину элемента (только для type = "image")

Атрибут	Описание
проверено	Указывает, что поле ввода должно быть предварительно выбрано при загрузке страницы (для type = "checkbox" или type = "radio")
инвалидов	Указывает, что поле ввода должно быть отключено.
макс.	Указывает максимальное значение для поля ввода
максимальная длина	Указывает максимальное количество символов для поля ввода
мин	Указывает минимальное значение для поля ввода
шаблон	Задает регулярное выражение для проверки входного значения по сравнению с
только для чтения	Указывает, что поле ввода доступно только для чтения (не может быть изменено)
требуется	Указывает, что поле ввода является обязательным (должно быть заполнено).
размер	Указывает ширину (в символах) поля ввода
шаг	Указывает допустимые интервалы номеров для поля ввода
	Указывает значение по умолчанию для поля ввода