Учебник по HTML и CSS

HTML

CSS

Статьи

Полезное


Статьи

Основы HTML
Текст
Изображения
Ссылки
Списки
Таблицы
Формы
Фреймы
Основы CSS
Рецепты CSS
Оформление таблиц
Основы верстки
Табличная верстка
Верстка с помощью слоев
Использование слоев
Примеры верстки слоями

Текстовое поле

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

Текстовое поле

Создает элемент для ввода пользователем строки текста.

<input type="text" параметры>

Параметры поля перечислены в табл. 1.

Табл. 1. Параметры текстового поля
Параметр Описание
size Ширина поля.
maxlength Максимальное количество символов разрешенных в тексте. Если этот параметр опустить, то можно вводить строку длинее самого поля.
name Имя поля. Предназначено для того, чтобы обработчик формы мог идентифицировать это поле.
value Начальный текст содержащий в поле.

В примере 1 показано создание текстового поля с разными параметрами

Пример 1. Текстовое поле

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<body>

<form action="/cgi-bin/handler.cgi">
<b>Как ваше имя?</b><br>
<input type="text" maxlength="25" size="20">
</form>

</body>
</html>

В результате получим следующее.

Как ваше имя?

Поле для пароля

Поле для пароля — обычное текстовое поле, но отличается тем, что все символы показываются звездочками. Предназначено для того, чтобы никто не подглядел вводимый пароль.

<input type="password" параметры>

Возможные параметры совпадают с предыдущим элементом и приведены в табл. 1. В примере 2 показано создание текстового поля для ввода пароля.

Пример 2. Поле для пароля

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<body>

<form action="/cgi-bin/handler.cgi">
<b>Логин:</b> <input type="text" maxlength="25" size="20" name="text"><br>
<b>Пароль:</b> <input type="password" maxlength="15" size="20" name="pass">
</form>

</body>
</html>

Результат данного примера показан ниже.

Логин:
Пароль:

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

Многострочный текст

Поле <TEXTAREA> предназначено для создания области, в которой можно вводить несколько строк текста.

<textarea параметры>
текст
</textarea>

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

Параметры поля перечислены в табл. 2.

Табл. 2. Параметры многострочного текста
Параметр Описание
name Имя поля. Предназначено для того, чтобы обработчик формы мог идентифицировать это поле.
cols Количество столбцов текста.
rows Число строк текста.
wrap Параметры переноса строк. Возможные значения:
off — отключает перенос строк;
virtuals — показывает переносы строк, но отправляет текст как он введен;
physical — переносы строк вставляются где указано и в таком виде текст отправляется.

Использование различных параметров продемонстрировано в примере 3.

Пример 3. Многострочный текст

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<body>

<form action="/cgi-bin/handler.cgi">
<b>Введите ваш отзыв:</b><br>
<textarea rows="10" cols="45"></textarea>
</form>

</body>
</html>

В результате получим следующее.

Введите ваш отзыв:




На главную









  • При использовании материалов сайта ссылка на comnew.ru обязательна!