Тег <input> Атрибут <type>

Сообщает браузеру, к какому типу относится элемент формы.

поддержка браузерами:
IExplorerChromeOperaSafariFirefoxAndroidiOS
3.0+1.0+4.0+1.0+1.0+1.0+1.0+
спецификация:
HTML:3.24.015.0
XHTML:1.01.1
синтаксис:
HTML	
<input type="button|checkbox|file|hidden|image|password|radio|reset|submit|text">

XHTML	
<input type="button|checkbox|file|hidden|image|password|radio|reset|submit|text" />
значения:

В табл. 1 перечислены возможные значения атрибута type и получаемый вид поля формы.

Табл. 1. Значения type
ТипОписаниеВид
buttonКнопка.
checkboxФлажки. Позволяют выбрать более одного варианта из предложенных. Пиво Чай Кофе
fileПоле для ввода имени файла, который пересылается на сервер.
hiddenСкрытое поле. Оно никак не отображается на веб-странице. 
imageПоле с изображением. При нажатии на рисунок данные формы отправляются на сервер.
passwordОбычное текстовое поле, но отличается от него тем, что все символы показываются звездочками. Предназначено для того, чтобы никто не подглядел вводимый пароль.
radioПереключатели. Используются, когда следует выбрать один вариант из нескольких предложенных. Пиво Чай Кофе
resetКнопка для возвращения данных формы в первоначальное значение.
submitКнопка для отправки данных формы на сервер.
textТекстовое поле. Предназначено для ввода символов с помощью клавиатуры.

 В HTML5 добавлены новые значения, представленные в табл. 2.

Табл. 2. Значения type в HTML5
ТипОписание
colorВиджет для выбора цвета.
dateПоле для выбора календарной даты.
datetimeУказание даты и времени.
datetime-localУказание местной даты и времени.
emailДля адресов электронной почты.
numberВвод чисел.
rangeПолзунок для выбора чисел в указанном диапазоне.
searchПоле для поиска.
telДля телефонных номеров.
timeДля времени.
urlДля веб-адресов.
monthВыбор месяца.
weekВыбор недели.

 

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

text

пример кода:
<!DOCTYPE HTML>
<html>
 <head>
  <meta charset="utf-8">
  <title>Тег input, атрибут type</title>
 </head>
 <body>  
 
  <form action="input10.php">
   <p><input type="radio" name="drink" value="rad1"> Пиво<Br>
   <input type="radio" name="drink" value="rad2"> Чай<Br>
   <input type="radio" name="drink" value="rad3"> Кофе</p>
   <p><input type="image" src="images/imgbutton.gif"></p>
  </form>

 </body>
</html>