Эту статью полностью посвятим формам html.
Во первых, что такое форма html. Все Вы конечно же встречали элементы, или поля, в которые нужно вводить логин и пароль. Так вот — это форма.
Различные окошки, в которые выставляются галочки или точки для выбора того или иного элемента или действия — это тоже форма.
Поля для комментариев, кнопки Отправить, Очистить, Выберите файл — всё это тоже формы html.
Создаются формы при помощи тегов <form> и <input>, причём тег <form> создаёт саму форму и имеет открывающую и закрывающую части, а тег <input> определяет вид и содержание, и закрывающей части не имеет.
Написание:
<form>
<input … …>
</form>
Тег <input> имеет обязательный атрибут, или параметр type, значение которого определяет, какой вид будет иметь форма.
Кроме обязательного атрибута type, тег input принимает ещё ряд атрибутов, значения которых влияют на формы.
size — определяет ширину текстового поля.
Значение задаётся любым целым числом, так как ширина поля определяется числом символов шрифта и их шириной, то есть если поменять шрифт на тот, у которого отличается ширина символов, то ширина поля тоже изменится.
Синтаксис: <input type="text" size="20">
value — присваивает значение элемента.
В зависимости от типа формы, значения атрибута value выполняют следующие функции:
1. Для текстовых полей, указывает предварительно введённую строку. Например в форме подписки — это Ведите Ваш E-mail. При заполнения поля, эта строка исчезает, а после очистки появляется вновь.
<input type="text" value="Введите Ваш e-mail">
2. Для кнопок устанавливает текст внутри кнопки.
<input type="button" value="Кнопка">
3. Для переключателей и флажков, в значении атрибута value, для каждого флажка ставится уникальное название, чтоб серверная программа могла определить, какой именно элемент выбрал пользователь.
<input type="radio" value="one"> Арбуз
<input type="radio" value="two"> Дыня
align — определяет выравнивание изображения, текста.
Принимает значения:
bottom — выравнивание по нижней границе (задаётся по умолчанию);
top — выравнивание изображения по самому высокому элементу первой строки;
left — выравнивание по левому краю;
right — выравнивание по правому краю;
middle — выравнивание середины изображения по базовой линии;
<input type="image" src="images/10.png" align="left">
alt — альтернативный текст изображения.
Выводит окно с описанием изображения при наведении курсора.
<input type="image" alt="Любой текст">
border — добавляет рамку к изображению.
Задаётся только толщина рамки любым целым числом в пикселях. Цвет — под цвет текста.
<input type="image" border="2">
name — имя формы, необходимое для идентификации её обработчиком.
В значении указывается любое уникальное имя.
<input type="Любой из элементов" name="Любое имя">
checked — предварительно активированный переключатель или флажок.
У этого атрибута нет значений. Просто его присутствие указывает, что переключатель или флажок уже помечен.
disabled — блокирует возможность изменения элемента.
У этого атрибута нет значений. Его присутствие блокирует всякую активность в форме.
maxlenght — определяет максимальное количество символов в тексте.
В значении указывается любое целое положительное число
<input type="text" maxlenght="200">
readonly — устанавливает, что поле и его содержание не могут изменятся пользователем.
У этого атрибута нет значений.
Форма комментариев создаётся несколько иначе.
Для создания формы комментариев применяется тег textarea
Размер окно задаётся атрибутами cols и rows, через количество предполагаемых строк и столбцов.
Их значения задаются любыми целыми положительными числами.
Синтаксис:
Комментарий<br>
<textarea name="comment" cols="40" rows="3"></textarea>
Желаю творческих успехов!