<textarea>

Что делает тег

Тег <textarea> создаёт многострочное поле для ввода текста.

Синтаксис тега <textarea>

<textarea rows="4" cols="50">
Введите текст здесь
</textarea>

Атрибуты rows и cols определяют высоту и ширину поля. Текст, заключённый между открывающим и закрывающим тегами, задаёт начальное содержимое поля.

Спецификация HTML

Тег является частью спецификации HTML Living Standard.

Семантический или нет

Тег <textarea> не считается семантическим, так как не придаёт никакого конкретного значения содержимому.

Примеры использования

Поле для ввода отзыва:

<label for="feedback">Оставьте отзыв:</label>
<textarea id="feedback" name="feedback" rows="6" cols="40">></textarea>

Поле для ввода адреса:

<label for="address">Введите адрес:</label>
<textarea id="address" name="address" rows="3" cols="30">></textarea>

Для чего использовать тег <textarea>

• Создать форму обратной связи.
• Добавить поле для ввода комментария к посту на форуме.
• Добавить поле ввода текста в веб-почте.

Атрибуты тега <textarea>

cols — ширина поля в символах.

rows — высота поля в строках.

disabled — блокирует доступ и изменение элемента пользователем.

readonly — Блокирует изменение содержимого элемента, но позволяет отправлять данные на сервер.

name — уникальное имя элемента.

required — поле обязательно для заполнения.

wrap — как обрабатывать переносы строк.

autocomplete — включает или выключает автозаполнение.

maxlength — максимальная длина текста.

minlength — минимальная длина текста.

placeholder — текст-подсказка для пользователей.

Глобальные атрибуты

Тег поддерживает все глобальные атрибуты HTML.

Ограничения

Тег <textarea> не может быть использован внутри тегов <button> и <progress>.

Нюансы

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

<textarea>
  Текст по умолчанию
</textarea>

Поддержка браузерами

Тег поддерживается всеми современными браузерами.

Актуальная информация — на сaniuse.

Альтернативные теги

Для ввода текста можно использовать тег <input> с подходящими атрибутами, например, type="text" или type="password".

Чем заменить тег

Тег <textarea> можно заменить тегом <input>. Также можно использовать сторонние редакторы текста, например, CKEditor.

Актуальность

Тег <textarea> не устарел, можете использовать его в веб-разработке.

Хотите узнать больше об HTML-тегах?

Прочитайте справочник по HTML или познакомьтесь с вёрсткой на интерактивных тренажёрах в HTML Academy.

«Доктайп» — журнал о фронтенде. Читайте, слушайте и учитесь с нами.