HTML Тег <form>
Приклад
HTML-форма з двома полями введення та однією кнопкою надсилання:
<form action="/action_page.html" method="get">
<label for="fname">Ім’я:</label>
<input type="text" id="fname" name="fname"><br><br>
<label for="lname">Прізвище:</label>
<input type="text" id="lname" name="lname"><br><br>
<input type="submit" value="Надіслати">
</form>
Спробуйте самі »
Більше прикладів "Спробуйте самі" далі.
Визначення та використання
Тег <form> використовується для створення HTML-форми для введення користувачем.
Елемент <form> може містити один або декілька з наступних елементів форми:
Підтримка браузерами
| Елемент | |||||
|---|---|---|---|---|---|
| <form> | Yes | Yes | Yes | Yes | Yes |
Атрибути
| Атрибут | Значення | Опис |
|---|---|---|
| accept-charset | character_set | Визначає кодування символів, які мають використовуватися для надсилання форми |
| action | URL | Визначає, куди надсилати дані форми під час надсилання форми |
| autocomplete | on off |
Визначає, увімкнути чи вимкнути автозаповнення у формі |
| enctype | application/x-www-form-urlencoded multipart/form-data text/plain |
Визначає, як мають бути закодовані дані форми під час надсилання їх на сервер (лише для method="post") |
| method | get post |
Визначає метод HTTP для надсилання даних форми |
| name | text | Визначає назву форми |
| novalidate | novalidate | Вказує, що форму не слід перевіряти під час надсилання |
| rel | external help license next nofollow noopener noreferrer opener prev search |
Визначає зв’язок між пов’язаним ресурсом і поточним документом |
| target | _blank _self _parent _top |
Визначає, де відображати відповідь, отриману після надсилання форми |
Глобальні атрибути
Тег <form> також підтримує Глобальні атрибути в HTML.
Атрибути подій
Тег <form> також підтримує Атрибути подій в HTML.
Більше прикладів
Приклад
HTML-форма з прапорцями:
<form action="/action_page.html" method="get">
<input type="checkbox" name="vehicle1" value="Bike">
<label for="vehicle1"> У мене є велосипед</label><br>
<input type="checkbox" name="vehicle2" value="Car">
<label for="vehicle2"> У мене є автівка</label><br>
<input type="checkbox" name="vehicle3" value="Boat" checked>
<label for="vehicle3"> У мене є дівчина</label><br><br>
<input type="submit" value="Надіслати">
</form>
Спробуйте самі »
Приклад
HTML-форма з перемикачами:
<form action="/action_page.html" method="get">
<input type="radio" id="html" name="fav_language" value="HTML">
<label for="html">HTML</label><br>
<input type="radio" id="css" name="fav_language" value="CSS" checked="checked">
<label for="css">CSS</label><br>
<input type="radio" id="javascript" name="fav_language" value="JavaScript">
<label for="javascript">JavaScript</label><br><br>
<input type="submit" value="Submit">
</form>
Спробуйте самі »
Пов’язані сторінки
HTML підручник: HTML Форми та введення
HTML DOM довідник: Об’єкт Form
CSS підручник: Стилізація форм
CSS налаштування за замовчуванням
Більшість браузерів будуть відображати елемент <form> з наступними значеннями за замовчуванням:
