наверх






Текстовая область



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

<textarea>


Данный тег парный. Между парами данного тега обычно записывается текст, который будет стоять в текстовой области по умолчанию. Если вам не надо этого, то обычно нечего между тегами не записывается. У тега <textarea> имеется несколько атрибутов.

cols и rows


Данные атрибуты отвечают за высоту и ширину текстовой области.
cols - это высота, а rows ширина. Высота записывается не в пикселях, а в строчках. Ширина записывается в количестве столбцов.

<textarea cols="10" rows="15"></textarea>


name


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

<textarea name="feedback" cols="40" rows="8">Введите здесь ваш вопрос</textarea>


Список



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

<select>


Этот тег парный. Внутри данного тега прописываются теги <option>, в которых записываются варианты ответа. Тег <option> так же парный, слова записываются как раз внутри него. Пример использования тега:

<select>
<option>Вариант 1</option>
<option>Вариант 2</option>
<option>Вариант 3</option>
</select>


Для того чтобы сделать возможность мульти-выбора, нужно добавить к тегу <select> одиночный атрибут multiple.
Так же, что бы вывести все варианты разом и чтобы пользователь не мотал ползунок, для этого достаточно добавить атрибут size. В этом атрибуте прописывается цифра, которая определяет количество открытых строк. Пример:

<select size="3" multiple>
<option>Мультфильмы</option>
<option>Фильмы</option>
<option>Сериалы</option>
</select>


Создадим небольшую форму:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>
<form name="feedback" method="post" action="feedback.php">
<br>Вопрос:<br>
<br><textarea name="feedback" cols="40" rows="8">Введите здесь ваш вопрос</textarea>
<br>
<br>Важность вопроса:<br><br>
<select>
<option>Очень важный</option>
<option>Средний</option>
<option>Обычный</option>
</select>
<br>
<br><input type="submit" value="Отправить">
</form>
</body>
</html>




Конечный результат можно просмотреть на данной демо-странице.





Поделиться
Text-shadow генератор
Занимаетесь веб-разработкой? Полноценный кроссбраузерный text-shadow генератор с поддержкой нескольких теней.


Комментарии — 0


У вас нет прав для добавления комментария. Зарегистрируйтесь или авторизуйтесь.