HTML тег <form>

Элемент <form> (от англ. "form" ‒ «форма») создаёт HTML-форму для ввода пользователем данных, которые впоследствии можно принять и обработать на стороне сервера.

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

Для отправки формы на сервер используется кнопка Submit, того же можно добиться, если нажать клавишу Enter в пределах формы.

Элемент <form> может содержать один или несколько следующих элементов:

  • <input>
  • <textarea>
  • <button>
  • <select>
  • <option>
  • <optgroup>
  • <fieldset>
  • <label>

Синтаксис

<form>...</form>

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

Обязателен.

Атрибуты

acceptУстарел в HTML5
Определяет разделенный запятыми список типов файлов, которые принимает сервер (который может быть представлен через загрузку файлов).
accept-charset
Определяет кодировку, используемую в представленной форме (значением по умолчанию является зарезервированная строка "unknown", которая указывает, что кодировка соответствует кодировке документа, содержащего элемент <form>).
action
(Действие) — обязательный атрибут (в HTML5 — нет), содержащий адрес, куда отправляется форма (по умолчанию действие установлено на текущую страницу).
autocompleteHTML5
Включает автозаполнение полей формы.
enctype
Определяет способ кодирования данных формы при их отправке. Значение по умолчанию application/x-www-form-urlencoded.
method
Атрибут определяет какой метод HTTP (get или post) используется при передаче формы. Метод get используется по умолчанию.
name
Имя формы.
novalidateHTML5
Отменяет встроенную проверку данных формы на корректность ввода.
target
Имя окна или фрейма, куда обработчик будет загружать возвращаемый результат.

Для этого элемента доступны глобальные атрибуты и события.

Стилизация по умолчанию

Большинство браузеров отобразит элемент <form> со следующими значениями CSS по умолчанию:

form {
    display: block;
    margin-top: 0em;
}

Различия между HTML 4.01 и HTML5

В HTML5 тегу <form> добавлены два новых атрибута: autocomplete и novalidate, а также больше не поддерживается атрибут accept.

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

Элемент <form>

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

Пример HTML:

Попробуй сам
<form action="/action_form.php" method="get">
  Имя: <input type="text" name="firstname"><br>
  Фамилия: <input type="text" name="lastname"><br>
  <input type="submit" value="Отправить">
</form>

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

Спецификация Статус
WHATWG HTML Living Standard (WHATWG) Живой стандарт
HTML 4.01 (W3C) Рекомендация
HTML5 (W3C) Рекомендация
HTML 5.1 (W3C) Рекомендация

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

Попробуйте сами - Примеры

Форма с радиокнопками:
Форма с четырьмя радио кнопками и кнопкой отправки.

Форма с флажками:
Форма с пятью флажками и кнопкой отправки.


Учебник HTML

HTML уроки: HTML Формы



Contema