Формы в HTML используются для облегчения ввода информации пользователем.
Примеры
Пример демонстрирует как создать текстовое поле на html-страничке. Пользователь может написать текст в этом поле.
Этот пример демонстрирует вставку поля ввода пароля в html-страничке.
Формы
Форма — это поле, которое содержит элементы форм.
Элементы форм — это элементы, которые позволяют пользователю вводить информацию (текстовые поля, выпадающие меню, галочки, выбор нескольких значений и т.д.) в форму.
Форма вставляется с помощью тега .
*
Элементы, обеспечивающие ввод пользовательской информации
*
Элемент Input
Наиболее часто используемым тегом форм является тег . Тип ввода информации задается изменением атрибута type. Наиболее часто используемые типы объясняются ниже.
Текстовые поля
Текстовые поля используются если вы хотите позволить пользователю написать письмо (в электронной почте), комментарий, числа и т.д.
Ваше имя:
Ваша фамилия:
Как это будет выглядеть в браузере:
Не забудьте, что сама форма не видна. Также помните, что в большинстве браузеров ширина текстового поля ограничена 20 символами.
Переключатель
Переключатель используется когда надо дать пользователю возможность выбрать одно значение из ограниченного количества значений.
Мужчина
Женщина
Как это будет выглядеть в браузере:
Помните, что может быть выбрано только одно значение из нескольких значений.
Множественный выбор
Формы множественного выбора используются когда надо дать возможность пользователю выбирать одно или несколько значений из ограниченного количества значений.
У меня есть мотоцикл:
У меня есть автомобиль:
У меня есть велосипед:
Как это будет выглядеть в браузере:
Атрибут action и кнопка submit (подтверждение)
Когда пользователь нажимает кнопку submit (подтвердить), содержимое формы (введенное пользователем) отправляется на сервер. Атрибут action определяет название файла, в который будет отправлен контент формы. Этот файл обычно обрабатывает присланный ему контент.
Ваш логин:
Как это будет выглядеть в браузере:
Изменением значения атрибута value для элемента submit можно изменить надпись на кнопке. Например, вот так:
И в браузере:
Еще примеры
Пример демонстрирует создание форм множественного выбора. Пользователь может выбрать одно или несколько значений.
Пример демонстрирует создание формы для выбора одного значения из нескольких.
Пример демонстрирует создание простого выпадающего меню. Выпадающее меню — это список значений, каждое из которых можно выбрать.
Этот пример демонстирует создание выпадающего меню с предварительно выбранным значением.
Пример демонстрирует создание текстового поля (многострочное поле для ввода текста). Пользователь может написать текст в этом поле, при этом количество вводимых символов не ограничено.
Пример демонстрирует создание кнопки. Текст на кнопке может быть изменен вами.
Теги форм