«Единственный способ творить великие дела – это любить то, что ты делаешь»
HTML


Тег <input> используется совместно с тегом <form>. Он служит для создания полей ввода данных, расположенных в форме: тестовые поля, различные кнопки, флажки и переключатели...

С помощью элементов, созданных тегом <input>, пользователь вносит данные в форму, которые затем отправляются на сервер для обработки.

Закрывающий тег

Не имеет


Атрибут Аlign

Атрибут align тега input - выравнивание изображения по горизонтали/вертикали относительно текста и других элементов формы.

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

- left - выравнивание изображения по левому краю окна формы
- right – выравнивание изображения по правому краю окна формы
- top - верхняя граница изображения выравнивается по уровню самого высокого элемента текущей строки
- bottom – нижняя граница изображения выравнивается по базовой линии текущей строки.
- middle – выравнивание середины изображения по базовой линии текущей строки

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

Атрибут Аlt

Атрибут alt тега input - альтернативный текст для кнопки с изображением. Он будет отображен вместо изображения, если оно по каким-то причинам отсутствует.

Значение/я атрибута:
Любой текст
Значение по умолчанию:
Не имеет

Атрибут Border

Атрибут border тега input - указывает толщину рамки вокруг изображения.

Значение/я атрибута:
Указывается целое положительное число, которое задает толщину рамки в пикселях.
Значение по умолчанию:
0

Атрибут Checked

Атрибут checked тега input - определяет заранее помеченное поле: такое как флажок (checkbox ) или переключатель (radio).

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

Значение/я атрибута:
Не имеет
Значение по умолчанию:
Не имеет

Атрибут Disabled

Атрибут disabled тега input - устанавливает блокировку поля. В заблокированное поле нельзя, например, поставить флаг или ввести текст.

Значение/я атрибута:
Не имеет
Значение по умолчанию:
Не имеет

Атрибут Maxlength

Атрибут maxlength тега input - устанавливает максимальное количество символов, которое можно ввести в текстовое поле.

Значение/я атрибута:
Указывается целое положительное число
Значение по умолчанию:
Количество символов не ограничено

Атрибут Name

Атрибут name тега input - определяет имя, используемое обработчиком для идентификации поля. Если Вы собираетесь куда-нибудь передавать информацию из формы, то обязательно вводите имя.

Значение/я атрибута:
Набор символов - цифры и буквы
Значение по умолчанию:
Не имеет

Атрибут Readonly

Атрибут readonly тега input - текстовое поле только для чтения - нельзя изменить его содержимое.

Значение/я атрибута:
Не имеет
Значение по умолчанию:
Не имеет

Атрибут Size

Атрибут size тега input - определяет ширину текстового поля в символах.

Значение/я атрибута:
Целое положительное число
Значение по умолчанию:
24

Атрибут Src

Атрибут src тега input - задает адрес графического файла для поля с изображением.

Значение/я атрибута:
Абсолютный или относительный путь к файлу (подробнее здесь...)
Значение по умолчанию:
Не имеет

Атрибут Type

Атрибут type тега input - определяет тип поля.

Значение/я атрибута:
- button - кнопка
- checkbox - флажок. Возможен выбор нескольких вариантов из предложенных
- file - в поле вводится имя пересылаемого файла
- hidden - скрытое поле, не отображаемое на странице, дает возможность передавать скрытую информацию
- image - кнопка-изображение
- password – текстовое поле - используется для ввода пароля. Вместо символов будут показаны звездочки
- radio - переключтель. Возможен выбор лишь одного варианта из предложенных
- reset - кнопка сброса - возврата полей формы к их первоначальному виду - сброс введенных данных.
- submit - кнопка для отправки данных на сервер
- text - текстовое поле. В него вводят символы с клавиатуры.

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

Атрибут Value

Атрибут value тега input - значение элемента формы, которое будет отправлено на сервер.
На сервер отправляется пара «имя=значение». Пара задается атрибутами name и value соответственно.

Атрибут value, в зависимости от типа поля:

- устанавливает текстовую надпись на кнопках (type = "button","reset","submit");
- устанавливает предварительную надпись на текстовых полях (type = "password","text"). Текст можно редактировать;
- для флажков и переключателей (type = "checkbox","radio") установленное значение служит идентификатором выбранного пункта.

Значение/я атрибута:
Любой текст
Значение по умолчанию:
Не имеет
Пример
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title> Тег input </title>
</head>
<body>

<form action="obrabotka.php" method="post" name="test" target="_blank">
<p> Введите ФИО:
<input type="text" name="FIO" size="50">
<p> Место предполагаемой работы: <br>
<input type="radio" name="mesto" value="RF" checked> Russia <br>
<input type="radio" name="mesto" value="EU"> Europa <br>
<input type="radio" name="mesto" value="USA"> USA <br>
<p> Должность (<em> можно совмещать </em>): <br>
<input type="checkbox" name="dol" value="1"> №1 <br>
<input type="checkbox" name="dol" value="2"> №2 <br>
<input type="checkbox" name="dol" value="3"> №3 <br>
<p> О себе: <input type="text" value="Информация не интересует!" size="30" disabled>
<p> Введите пароль:
<input type="password" name="pasw" size="30" maxlength="10">
<p> <input type="submit" value="Отправить" disabled>
<p> <input type="reset" value="Сбросить">
</form>

</body>
</html>
Результат

Пояснение к примеру

Кнопка Отправить заблокирована, так как форма в примере не работает (она не связана с обрабатывающим скриптом) - она лишь иллюстрирует варианты различных полей, создаваемых тегом <input> и предназначенных для внесения данных в форму.

Кнопка Сбросить активна - Вы можете ввести данные в поля, а при необходимости привести их к первоначальному виду.



Все теги HTML

HTML по шагам