Содержание

Тег | htmlbook.ru

Internet ExplorerChromeOperaSafariFirefoxAndroidiOS
3.0+1.0+4.0+1.0+1.0+1.0+1.0+

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

HTML:3.24.015.0XHTML:1.01.1

Описание

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

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

Поле с исходным текстом

Синтаксис

<textarea атрибуты>
  текст
</textarea>

Атрибуты

accesskey
Переход к полю с помощью сочетания клавиш.
autofocus
Автоматическое получение фокуса.
cols
Ширина поля в символах.
disabled
Блокирует доступ и изменение элемента.
form
Связывает текстовое поле с формой по её идентификатору.
maxlength
Максимальное число введенных символов.
name
Имя поля, предназначено для того, чтобы обработчик формы мог его идентифицировать.
placeholder
Указывает замещающийся текст.
readonly
Устанавливает, что поле не может изменяться пользователем.
required
Обязательное для заполнения поле.
rows
Высота поля в строках текста.
tabindex
Порядок перехода между элементами при нажатии на клавишу Tab.
wrap
Параметры переноса строк.

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

Закрывающий тег

Обязателен.

Пример

HTML5IECrOpSaFx

<!DOCTYPE HTML>
<html>
 <head>
  <meta charset="utf-8">
  <title>Тег TEXTAREA</title>
 </head>
 <body>

  <form action="textarea1. php" method="post">
    <p><b>Введите ваш отзыв:</b></p>
    <p><textarea rows="10" cols="45" name="text"></textarea></p>
    <p><input type="submit" value="Отправить"></p>
  </form>

 </body>
</html>

Элемент textarea | HTML/xHTML

Элемент textarea HTML— это поле для ввода текста, состоящего из нескольких строк, и его редактирования. Он используется для ввода и редактирования длинных фрагментов текста.

Содержимое этого элемента представляет его исходное значение. Оно отображается в текстовом поле после загрузки документа или после нажатия кнопки сброса в форме.

В первом примере мы создадим форму с элементом управления textarea со всеми значениями по умолчанию. Также мы установим атрибут placeholder с подсказкой относительно того, контент какого типа должен вводиться в поле. Она будет отображаться, когда текстовая область пуста:

<form action="../../form-result. php" target="_blank">
  <p>Message to the author:</p>
  <p><textarea name="message" placeholder="Share your opinion with the author!"></textarea></p>
  <p><input type="submit" value="Send message"></p>
</form>

Во втором примере мы установим начальное значение в качестве содержимого HTML textarea. Оно будет использоваться для заполнения элемента управления сразу после загрузки документа, а также после сброса формы.

В отличие от поля для ввода однострочного текста элемент textarea использует начальное значение в качестве содержимого (вместо атрибута value):

<form action="../../form-result.php" target="_blank">
  <p>Edit your comment:</p>
  <p><textarea name="comment">Hi! I think you're all wrong!</textarea></p>
  <p>
    <input type="submit" value="Edit">
    <input type="reset" value="Reset">
  </p>
</form>

Далее мы используем атрибуты cols и rows, чтобы задать количество символов, которые могут одновременно отображаться в элементе управления. Браузеры рассчитывают ширину и высоту элемента, умножая эти значения на ширину и высоту символа используемого шрифта.

Ширина HTML input textarea вычисляется относительно ширины символа используемого шрифта. Так как символы не всегда имеют одинаковую ширину, то браузеры могут использовать различные методы, чтобы округлить это значение:

<form action="../../form-result.php" target="_blank">
  <p>Add a new description:</p>
  <p><textarea name="description" cols="40" rows="5"></textarea></p>
  <p><input type="submit" value="Submit"></p>
</form>

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

Соответствие minlength проверяется только при отправке данных формы, а в maxlength браузеры проверяют, чтобы пользователь не ввел больше символов, чем указано через этот атрибут.

Атрибут maxlength элемента textarea HTML хорошо поддерживается браузерами, а minlength – нет:

<form action="../../form-result.php" target="_blank">
  <p>Edit your biography:</p>
  <p><textarea name="biography" minlength="20" maxlength="50"></textarea></p>
  <p><input type="submit" value="Submit"></p>
</form>

Теперь мы используем атрибут required, который был введен в HTML5. Когда этот атрибут указан, браузер не позволяют отправить данные формы, пока соответствующее поле не будет заполнено.

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

Указывает браузеру, должен ли он автоматически предлагать варианты при вводе данных для этого элемента управления, пытаясь угадать, что пользователь печатает. Для данного атрибута элемента HTML textarea допустимы два значения, они не чувствительны к регистру:

  • on: браузер должен предлагать варианты автоматически. Это значение по умолчанию;
  • off: браузер не должен предлагать варианты автоматически.

Пример:

<form action="../../form-result.php" target="_blank">
  <p>Justify your answer:</p>
  <p><textarea name="justification" autocomplete="off"></textarea></p>
  <p><input type="submit" value="Submit"></p>
</form>

Логическое значение, указывающее браузеру установить фокус ввода на элементе управления после завершения загрузки документа или при открытии диалогового окна, в котором отображается элемент управления. Если атрибут имеет значение «autofocus«, пустую строку (» «), то элемент управления будет находиться в фокусе ввода сразу после загрузки страницы или диалогового окна.

Пример:

<textarea name="thoughts" autofocus></textarea>

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

Значение, указанное в этом атрибуте тега textarea в HTML должно быть целым числом больше нуля. Если значение отсутствует или имеет некорректный формат, атрибуту будет присвоено значение по умолчанию — 20.

Пример:

<form action="../../form-result.php" target="_blank">
  <p>Special thanks:</p>
  <p><textarea name="thanks" cols="20" rows="6"></textarea></p>
  <p><input type="submit" value="Submit"></p>
</form>

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

Так как этот атрибут textarea HTML является относительно новым, он не полностью поддерживается браузерами. Разработчики должны проверять поддержку браузерами при получении данных на стороне сервера.

Пример:

<form action="../../form-result.php" target="_blank">
  <p>Contribute with an idea:</p>
  <p><textarea name="idea" dirname="idea-dir"></textarea></p>
  <p><input type="submit" value="Submit"></p>
</form>

Логическое значение, указывающее отключен ли данный элемент управления или нет. Если атрибут принимает значение «disabled» или пустую строку («»), то элемент управления отключен.

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

Пример:

<form action="../../form-result.php" target="_blank">
  <p>A penny for your thoughts:</p>
  <p><textarea name="thoughts" disabled></textarea></p>
  <p><input type="submit" value="Submit"></p>
</form>

Значение атрибута идентификатора формы, с которой HTML input textarea связан.

Этот атрибут является новым и был введен в HTML5. Он помогает определить принадлежность элементов управления во вложенных или разделенных формах.

Пример:

<p>Introduction:</p>
<p><textarea name="introduction" form="form1"></textarea></p>
<form action="../../form-result.php" target="_blank">
  <p><input type="submit" value="Submit"></p>
</form>

Указывает, какой способ ввода является наиболее приемлемым для пользователей. Существует двенадцать возможных значений, не чувствительных к регистру:

  • verbatim: алфавитно-цифровой ввод на латинице текста, такого как имена пользователей, пароли, коды товаров и т.д.;
  • latin: ввод на латинице на предпочтительном для пользователя языке с подключением вспомогательных средств, таких как автоматическое заполнение. Предназначен для передачи данных от пользователей компьютеру. Например, через форму поиска;
  • latin-name: ввод на латинице на предпочтительном для пользователя языке, с подключением некоторых вспомогательных средств. Таких, как автоматическое заполнение предлагаемых имен из списка контактов и автоматическая установка регистра;
  • latin-prose: ввод для передачи данных от человека человеку с автоматическим заполнением предлагаемого текста и автоматической расстановкой заглавных букв в начале предложений;
  • full-width-latin: ввод на латинице на втором языке пользователя, с подключением вспомогательных средств для ввода символов в полном размере и передачи данных от человека человеку, таких как автоматическое заполнение предлагаемого текста и расстановка заглавных букв в начале предложений;
  • kana: ввод на кана или ромадзи, стандартный ввод на хирагана, использующий ввод символов в полном размере с поддержкой преобразования в кандзи. Предназначен для ввода текста на японском языке;
  • kana-name: то же самое, что и «kana«, но с подключением вспомогательных средств для ввода человеческих имен из списка контактов;
  • katakana: ввод на катакана с использованием символов и поддержкой преобразования в кандзи. Предназначен для ввода текста на японском языке;
  • numeric: ввод цифр, включая клавиши для цифр от 0 до 9, с использованием указанного символа, разделяющего тысячи и символа для отрицательных чисел. Рекомендуется для элемента ввода цифр;
  • tel: ввод номеров телефонов, включая клавиши цифр от 0 до 9, символа «#» и символа «*«. В некоторых локальных зонах это значение атрибута HTML textarea может включать буквенные мнемонические метки. Рекомендуется для элемента ввода номера телефона;
  • email: ввод текста в локали пользователя с использованием клавиш для ввода адреса электронной почты. Например, символов «@» и «.«. Рекомендуется для элемента ввода адреса электронной почты;
  • url: ввод текста в локали пользователя с использованием клавиш для ввода адресов. Например, символов «/» и «.«, а также для быстрого ввода частей доменных имен, таких как «www.» или «.co.uk«. Рекомендуется для элемента управления ввода URL-адреса.

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

Пример:

<form action="../../form-result.php" target="_blank">
  <p>List your friends:</p>
  <p><textarea name="friends" inputmode="latin-name"></textarea></p>
  <p><input type="submit" value="Submit"></p>
</form>

Целое число, указывающее максимальное количество символов, которое может содержать значение элемента управления.

Разработчики не должны полагаться на атрибут textarea HTML maxlength. Пользователи могут отправить данные формы через браузер, не поддерживающий эту функцию.

Пример:

<form action="../../form-result.php" target="_blank">
  <p>Resources:</p>
  <p><textarea name="resources" maxlength="20"></textarea></p>
  <p><input type="submit" value="Submit"></p>
</form>

Целое число, указывающее минимальное количество символов, которое может содержать значение элемента управления.

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

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

Пример:

<form action="../../form-result.php" target="_blank">
  <p>Analisys:</p>
  <p><textarea name="analisys" maxlength="20"></textarea></p>
  <p><input type="submit" value="Submit"></p>
</form>

Имя тега textarea в HTML. Оно будет отправлено браузером обработчику, связанному с содержимым элемента. Они вместе будут соответствовать паре имя-значение, которая используется для обработки данных формы.

Пример:

<form action="../../form-result.php" target="_blank">
  <p>Review:</p>
  <p><textarea name="review"></textarea></p>
  <p><input type="submit" value="Submit"></p>
</form>

Текст подсказки, как должно быть заполнено поле (пример или краткое описание). Браузеры могут отображать содержимое атрибута в элементе управления, хотя он не имеет никакого значения. Когда пользователь начинает вводить собственный текст, подсказка должна удаляться из элемента управления.

Пример:

<form action="../../form-result.php" target="_blank">
  <p>Results:</p>
  <p><textarea name="results" placeholder="Write down here the results of your study..."></textarea></p>
  <p><input type="submit" value="Submit"></p>
</form>

Логическое значение, указывающее браузеру запретить пользователю изменять значение элемента управления. Если атрибут имеет значение «readonly» или пустую строку («»), то пользователю запрещено изменять значение в элементе управления.

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

Пример:

<form action=". ./../form-result.php" target="_blank">
  <p>File "config.cfg":</p>
  <p>
    <textarea name="file" readonly>wait=24
login=db
autostart=yes
    </textarea>
  </p>
  <p><input type="submit" value="Submit"></p>
</form>

Логическое значение, указывающее на то, может ли данный элемент управления оставаться незаполненным. Если атрибут имеет значение «required» или пустую строку («»), то пользователь должен заполнить элемент управления, чтобы отправить данные формы.

Если HTML input textarea с атрибутом required не заполнен, то при попытке пользователя отправить данные формы, браузер выдаст ошибку и отменит отправку данных.

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

Пример:

<form action="../../form-result.php" target="_blank">
  <p>Leave your opinion:</p>
  <p><textarea name="opinion" required></textarea></p>
  <p><input type="submit" value="Submit"></p>
</form>

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

Значение, указанное в этом атрибуте тега textarea в HTML, должно быть целым числом больше нуля. Если значение отсутствует или имеет неправильный формат, то для атрибута будет назначено значение по умолчанию — 2.

Пример:

<form action="../../form-result.php" target="_blank">
  <p>Special thanks:</p>
  <p><textarea name="thanks" cols="20" rows="6"></textarea></p>
  <p><input type="submit" value="Submit"></p>
</form>

Значение, указывающее браузеру, должен ли переноситься текст при отправке данных формы. Для атрибута доступно два значения, не чувствительных к регистру:

  • soft: текст не будет переноситься при отправке данных формы, но он может переноситься при отображении. Это значение по умолчанию;
  • hard: текст будет переноситься при отправке данных формы с помощью добавления новых строк. Таким образом длина текста не превысит ширину фрейма.

Это относительно новый атрибут textarea HTML, его поддержка является неполной. Разработчикам придется полагаться на скрипты, чтобы обеспечить этот функционал во всех браузерах.

Пример:

<form action="../../form-result.php" target="_blank">
  <p>Codes list:</p>
  <p><textarea name="codeslist" cols="5" rows="6" wrap="hard"></textarea></p>
  <p><input type="submit" value="Submit"></p>
</form>

Данная публикация является переводом статьи «textarea element» , подготовленная редакцией проекта.

HTML/CSS input/textarea, текст по умолчанию и цвета



Два полусвязанных вопроса:

1) я видел поля <input> и <textarea> , которые содержат текст по умолчанию, например «введите поисковые запросы здесь», и в тот момент, когда вы нажимаете на поле, текст исчезает. Как это реализуется? Это что, штука Javascript?

2) Может ли текст по умолчанию быть в одном цвете, и все, что вы печатаете (либо перезапись, либо добавление), быть в другом цвете?

css textarea
Поделиться Источник accelerate     15 октября 2010 в 00:26

2 ответа


  • textarea текст по умолчанию дублируется

    Я создал контактную форму, которая включает в себя слова Enter Your Message по умолчанию для области комментариев. Мой код работает, но с ним есть проблема. Моя проблема заключается в том, что текст Enter your message генерируется дважды, если пользователь получает сообщение об ошибке, которое…

  • Скрыть textarea текст, но не мигающий курсор

    Я пытаюсь подражать тому, как twitter выделяет пользователей, когда они @mentioned при составлении твита. Я использую плагин mentionsInput jQuery . Я хочу изменить цвет @screen_name вместо изменения цвета фона, как это делает плагин по умолчанию. Есть ли способ раскрасить @screen_name и…



22

Не знаю, почему вышеизложенное помечено как ответ, потому что на самом деле это не ответ на вопрос. Надеюсь, что это так:

HTML4

<label for="name">Name</label>    
<input type="text" name="name" value="Enter your full name"  onfocus="if(this.value=='Enter your full name') {this. value='', this.style.color='#999'};" onblur="if(this.value=='') {this.value='Enter your full name', this.style.color='#555';}" />

Давайте разберемся с этим:

value="Enter your full name"

Это добавляет строку текста по умолчанию в ваш ввод.

<textarea>Enter your comment</textarea>

То же самое можно сделать с textarea, введя свой текст между тегами.

onfocus="if(this.value=='Enter your full name') {this.value='', this.style.color='#999'};"

Если вход получает фокус (т. е. мы проверяем, равен ли текущий входной текст нашей текстовой строке по умолчанию «Enter your full name». Если это так, то мы устанавливаем его в пустую строку и меняем цвет шрифта.

onblur="if(this.value=='') {this.value='Enter your full name', this.style.color='#555';}

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

HTML5

<input type="text" name="name" placeholder="Enter your full name">
<textarea placeholder="Enter your comment"></textarea>

HTML5 имеет встроенный атрибут ‘placeholder’ для этого, который может быть стилизован следующим образом:

::-webkit-input-placeholder  { color:#555; } /* Webkit */
:-moz-placeholder { color:#555; }  /* Firefox <= 18 */
::-moz-placeholder { color:#555; }  /* Firefox >= 19 */
:-ms-input-placeholder {  color: #555; } /* Internet Explorer */

EXAMPLE

Поделиться Turnip     01 августа 2012 в 15:13



1

  1. Они называются входными водяными знаками. Для этого вы можете найти множество плагинов jquery. Это один из них

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

Поделиться Lorenzo     15 октября 2010 в 00:30


Похожие вопросы:


многострочный html textarea

Моя форма наследует несколько стилей css, а отображение по умолчанию для textarea имеет только одну строку-если вы наберете абзац, он не будет обертываться, а продолжит идти по одной и той же…


Textarea текст по умолчанию не правильно

У меня есть textarea ниже. Когда я запускаю код, текст, который должен быть в textarea при обновлении, не выравнивается по левому краю и не находится сверху. Это мешает мне использовать события…


Текст по умолчанию на textarea jQuery?

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


textarea текст по умолчанию дублируется

Я создал контактную форму, которая включает в себя слова Enter Your Message по умолчанию для области комментариев. Мой код работает, но с ним есть проблема. Моя проблема заключается в том, что текст…


Скрыть textarea текст, но не мигающий курсор

Я пытаюсь подражать тому, как twitter выделяет пользователей, когда они @mentioned при составлении твита. Я использую плагин mentionsInput jQuery . Я хочу изменить цвет @screen_name вместо изменения…


Обоснуйте и центрируйте <textarea> текст HTML/CSS?

У меня есть textarea, и я хочу, чтобы он был выровнен так, чтобы все строки были равны по ширине и были центрированы так, чтобы текст оставался в середине textarea, когда он не имеет максимальной…


HTML ввод формы для изменения цвета шрифта CSS

Я пытаюсь использовать форму HTML для отправки значения цвета. <form> Font color:<br> <input type=color name=colorInput> <input type=submit value=Submit> </form> Затем…


css для ввода и textarea выглядит как простой текст html

У меня была форма с большим количеством <input> и <textarea> , и мне удается сохранять и извлекать данные с помощью php. Теперь мне нужно сделать еще один интерфейс (admin), где я должен…


Как изменить CSS атрибута-заполнителя в теге textarea/input?

Я пытаюсь изменить размер шрифта текста в атрибуте заполнителя элемента текстовой области. Я могу сделать это с помощью vanilla CSS, но когда я пытаюсь имитировать эту идею в своем…


Как я могу установить значение по умолчанию для элемента Materializecss textarea?

У меня есть текст, и я использую materialize css, и я хочу, чтобы у него было какое-то значение по умолчанию, но оно не отображается. Я заполнил поле value значением по умолчанию, но теперь оно…

HTML и CSS с примерами кода

Тег <textarea> (от англ. text area — область текста) это элемент формы для создания области, в которую можно вводить несколько строк текста. Количество символов, которое можно ввести в поле не ограничено, а введенный текст отображается моноширинным шрифтом.

В отличие от элемента <input>, в текстовом поле можно делать переносы строк, и они сохраняются при отправке текста на сервер.

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

Формы

Синтаксис

<textarea>
    текст
</textarea>

Закрывающий тег обязателен.

Атрибуты

autocomplete
Включает или отключает автозаполнение.
autofocus
Устанавливает фокус в поле формы.
cols
Ширина поля в символах.
dirname
Параметр, который передаёт на сервер направление текста.
disabled
Блокирует доступ и изменение элемента.
form
Связывает поле с формой по её идентификатору.
maxlength
Максимальное количество символов разрешённых в тексте.
minlength
Минимальное количество символов разрешённых в тексте.
name
Имя поля, предназначено для того, чтобы обработчик формы мог его идентифицировать.
placeholder
Выводит подсказывающий текст.
readonly
Устанавливает, что поле не может изменяться пользователем.
required
Обязательное для заполнения поле.
rows
Высота поля в строках текста.
wrap
Параметры переноса строк.

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

autocomplete

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

Автозаполнение конкретного поля формы привязывается к его атрибуту name и при смене значения теряется.

Синтаксис

<textarea autocomplete="on | off"></textarea>

Значения

on
Включает автозаполнение текста.
off
Отключает автозаполнение.

Значение по умолчанию

Зависит от настроек браузера.

autofocus

Автоматически устанавливает фокус в текстовое поле. В таком поле можно сразу набирать текст без переключения курсора в текстовое поле.

Синтаксис

<textarea autofocus> </textarea>

Значения

Нет.

Значение по умолчанию

По умолчанию атрибут autofocus не установлен.

cols

Ширина текстового поля, которое определяется числом символов моноширинного шрифта. Иными словами, ширина задаётся количеством близстоящих букв одинаковой ширины по горизонтали. Если размер шрифта изменяется с помощью стилей, ширина также соответственно меняется.

Синтаксис

<textarea cols="<число>"> </textarea>

Значения

Любое целое положительное число.

Значение по умолчанию

В HTML4 зависит от настроек браузера и операционной системы.

В HTML5 — 20.

dirname

При наличии атрибута dirname на сервер отправляется пара имя/значение, где имя задаётся атрибутом dirname, а значение подставляется браузером. Для текста, идущего слева направо, значение будет ltr, а для текста справа налево (арабского, к примеру) значение будет rtl.

Синтаксис

<textarea dirname="<строка>"></textarea>

Значения

Произвольная текстовая строка, которая служит именем параметра. Чтобы показать, что этот параметр указывает направление текста, обычно в конце строки добавляют .dir.

Значение по умолчанию

Нет.

disabled

Блокирует доступ и изменение текстового поля. Оно в таком случае отображается серым и недоступным для активации пользователем. Кроме того, такое поле не может получить фокус путем нажатия на клавишу Tab, мышью или другим способом. Тем не менее, такое состояние поля можно менять с помощью скриптов.

Заблокированный в поле текст не передаётся на сервер.

Синтаксис

<textarea disabled></textarea>

Значения

Нет.

Значение по умолчанию

По умолчанию это значение выключено.

form

Связывает текстовое поле с формой по её идентификатору. Такая связь необходима в случае, когда поле по каким-либо причинам располагается за пределами <form>.

Синтаксис

<textarea form="<идентификатор>"> </textarea>

Значения

Идентификатор формы (значение атрибута id элемента <form>).

Значение по умолчанию

Нет.

maxlength

Устанавливает максимальное число символов, которое может быть введено пользователем в текстовом поле. Когда это количество достигается при наборе, дальнейший ввод становится невозможным.

Синтаксис

<textarea maxlength="<число>"> </textarea>

Значения

Любое целое положительное число.

Значение по умолчанию

Нет.

minlength

Задаёт минимальное число символов, которое может быть введено пользователем в текстовом поле. Если число символов меньше указанного значения, то браузер выдаёт сообщение об ошибке и не отправляет форму.

Синтаксис

<textarea minlength="<число>"></textarea>

Значения

Любое целое положительное число.

Значение по умолчанию

Нет.

name

Определяет уникальное имя элемента <textarea>. Как правило, это имя используется при отправке данных на сервер или для доступа к полю через скрипты.

Синтаксис

<textarea name="<имя>"> </textarea>

Значения

В качестве имени используется набор символов, включая числа и буквы. JavaScript чувствителен к регистру, поэтому при обращении к элементу <textarea> по имени соблюдайте ту же форму написания, что и в атрибуте name.

Значение по умолчанию

Нет.

placeholder

Выводит подсказывающий текст внутри текстового поля, который исчезает при получении фокуса или наборе текста. В качестве подсказки обычно применяется короткий текст, состоящий из одного слова или фразы.

Синтаксис

<textarea placeholder="<текст>"> </textarea>

Значения

Текстовая строка.

Значение по умолчанию

Нет.

readonly

Когда к элементу <textarea> добавляется атрибут readonly, текстовое поле не может изменяться пользователем, в том числе вводиться новый текст или модифицироваться существующий. Тем не менее, состояние и содержимое поля можно менять с помощью скриптов. Также содержимое поле можно выделить и скопировать в буфер обмена.

Синтаксис

<textarea readonly></textarea>

Значения

Нет.

Значение по умолчанию

По умолчанию это значение выключено.

required

Устанавливает текстовое поле обязательным для заполнения перед отправкой формы на сервер. Если в обязательном поле нет текста, браузер выведет сообщение, а форма отправлена не будет. Вид и содержание сообщения зависит от браузера и меняться пользователем не может.

Синтаксис

<textarea required> </textarea>

Значения

Нет.

Значение по умолчанию

По умолчанию атрибут required выключен.

rows

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

Синтаксис

<textarea rows="<число>"></textarea>

Значения

Любое целое положительное число.

Значение по умолчанию

В HTML4 зависит от настроек браузера и операционной системы.

В HTML5 — 2.

wrap

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

Синтаксис

<textarea wrap="soft | hard"> </textarea>

Значения

soft
Слова в текстовом поле переносятся механически, если они не поместились в размер области, но при отправке на сервер переносы не сохраняются.
hard
Длинный текст, который самостоятельно не помещается в поле по ширине, автоматически переносится на новую строку и вместе с переносами отправляется на сервер. Для работы требуется наличие атрибута cols.

Значение по умолчанию

soft

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

Описание и примеры

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>TEXTAREA</title>
  </head>
  <body>
    <form action="textarea1.php" method="post">
      <p><b>Введите ваш отзыв:</b></p>
      <p>
        <textarea
          rows="10"
          cols="45"
          name="text"
        ></textarea>
      </p>
      <p><input type="submit" value="Отправить" /></p>
    </form>
  </body>
</html>

См. также

Ссылки

| lesson-web.ru

Следующий тег – «textarea». В целом, он очень похож на «input» с типом «text», но есть некоторое отличие. Давайте поймём какое.

Для этого мы сначала поставим «textarea».

 


<textarea></textarea>

 

Посмотрим, у нас появился вот такой вот прямоугольник, в который, опять же, мы можем вводить текст.

Но разница в чём? В том, что мы можем вводить многострочные данные. То есть, если в «input’е» мы вводим в одну строку и другого не дано, то здесь мы можем вводить много строк. Ещё у «textarea» есть уголочек, который позволяет увеличивать или уменьшать размер нашего «textarea». Я, как правило, потом блокирую этот треугольничек с помощью CSS, потом поймём, как это делается. Но он как бы есть. Если вам вдруг нужно менять размер «textarea», то вот этот треугольничек можно использовать. Если вам не нужно изменять размер «textarea», то его можно заблокировать. Вот так, на будущее пока что. 

В textarea мы вводим абсолютно любой текст, который нужно ввести. Допустим, этот тег можно использовать, если нужно ввести текст отзыва, или ещё какой-то большой текст, который должен содержать в себе какую-то большую информацию, а не просто имя, фамилия, отчество. Может быть, рассказ о себе, краткая биография. Вот для всего этого нужен «textarea».

В параметрах мы точно также пишем атрибут «name», в который мы пишем, что это за «textarea», что сюда вводится. Допустим, если отзыв, то можно «review» написать. 

Если нам нужно написать, что в себе несёт этот «textarea», то пишем в атрибуте «placeholder» «Отзыв», и у нас пишется сюда отзыв.

 


<textarea name="review" placeholder="Отзыв"></textarea>

 

Единственное отличие, что если нужно написать какое-нибудь значение заготовленное, то если в «input’е» мы писали «value», то «textarea» нужно писать значение между открывающим и закрывающим тегами. 

Хочу заметить, что «textarea» – это парный тег. В отличии от «input’а», у которого только открывающий тег, закрывающего нет. Поэтому, на будущее, «value» мы сюда не пишем, пишем только текст, который, если он нам нужен вообще, то пишем между открывающим и закрывающим тегом. 

Собственно, всё, что мы потом будем изучать по «input’ам» так же относится и к «textarea». Абсолютно такой же тег с той разницей, что пишем его в несколько строк и есть такой вот уголочек, который позволяет изменять размер вот этого нашего тега. Всё.

HTML Forms | Tags input and textarea

Form html – means of communication site with the visitor.

These are comment fields, the Send, Clear, Select button, boxes, which put checkmarks, password fields and captcha.

Form tags

<form></form> – form container

<textarea></textarea> – поле комментариев

<input> – field requiring visitor actions

<form>
<input.......>
<textarea>......</textarea>
</form>

<input> has a required attribute, whose value determines which type the form will have.

In addition to the required attribute type, the input tag accepts a number of attributes, the values of which affect forms..

size – determines the width of the text field.

Syntax: <input type="text" size="20">

value – assigns an element value.

Depending on the form type, the value attribute values perform the following functions.:

1. For text fields, specifies the previously entered string. For example, in the form of a subscription – this is Enter your E-mail. When you fill in the field, this line disappears, and after cleaning it appears again.

<input type="text" value="Enter your E-mail">

2. For buttons, sets the text inside the button..

<input type="button" value="Button">

3. For radio buttons and checkboxes, in the value of the value attribute, a unique name is set for each flag so that the server program can determine which element the user has selected..

<input type="radio" value="one"> Watermelon
<input type="radio" value="two"> Melon

align – determines the alignment of the image text.

Takes values:

bottom – bottom alignment;

top – image alignment on the highest element of the first row;

left – left alignment;

right – right alignment;

middle – alignment of the middle of the image to the baseline;

<input type="image" src="images/10.png" align="left">

alt – alternate text image

<input type="image" alt="Любой текст">

border – adds a frame to the image. Set the frame thickness to any integer in pixels. Color – the color of the text.

<input type="image" border="2">

name -form name required to identify.

The value indicates any unique name.

<input type="Any item" name="Any name">

checked – pre-activated switch; This attribute has no values. Just his presence indicates that the switch or checkbox is already marked.

disabled – blocks the ability to change an item.

This attribute has no values. His presence blocks all activity in the form.

maxlenght – determines the maximum number of characters in the text. The value indicates any positive integer.

<input type="text" maxlenght="200">

readonly – establishes that the field and its contents cannot be changed by the user.

Comment form

The textarea tag is used to create a comment form.

The window size is set by the cols and rows attributes.

cols – Number of lines

rows – Number of columns

Their values are given by any positive integers.

Сomment<br>
<textarea name="comment" cols="40" rows="3"></textarea>

Сomment

Code page with forms

<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8" />
<title>Forms</title>
<body>
<form>
<p>Войти
<input type="password" value="Password">
<input type="text" value="Login"></p>

<p>Your gender<br>
<input type="radio" name="pol" value="muj"> Male<br>
<input type="radio" name="pol" value="jen"> Female</p>

<p>Your profession<br>
<input type="checkbox" name="builder" value="buil"> Builder<br>
<input type="checkbox" name="military" value="mil"> Military<br>
<input type="checkbox" name="farmer" value="farm"> Farmer</p>

<p>Write a few words about yourself<br>
<textarea name="comment" cols="40" rows="3"></textarea></p>

<p><input type="submit">
<input type="reset"></p>
</form>
</body>
</html>

This is pure html. If you apply the design of css, then the html form can be made much nicer.

Html-tables < < < Category > > >

| Справочник HTML



Элемент <textarea> (от англ. «text area» ‒ «текстовое поле») определяет многострочное текстовое поле. Основное отличие от тега <input> заключается в том, что допускаются переносы строк (они сохраняются при отправке данных на сервер). По умолчанию количество символов, которое можно ввести в поле не ограничено, а введенный текст отображается моноширинным начертанием.

Примечание: Отображаемый размер текстового поля ввода можно задавать при помощи атрибутов cols и rows, либо при помощи CSS свойств height и width.

Синтаксис

<textarea>...</textarea>

Закрывающий тег

Обязателен.

Атрибуты

autocompleteHTML5
Включает или отключает автозаполнение.

autofocusHTML5
Указывает, что текстовая область должна автоматически получать фокус при загрузке страницы.

cols
Определяет видимую ширину текстовой области (в символах). Значение по умолчанию 20 символов.

dirnameHTML5
Параметр, который передаёт на сервер направление текста.

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

formHTML5
Определяет форму с которой связан элемент <textarea>. В качестве значения атрибута выступает идентификатор элемента <form>. Этот атрибут позволяет размещать многострочное текстовое поле в произвольном месте документа, а не только в качестве потомка элемента <form>.

maxlengthHTML5
Определяет максимально количество символов, которое можно будет ввести в текстовое поле.

minlengthHTML5
Указывает минимальное количество символов, которое может содержаться в текстовой области.

name
Определяет имя для текстового поля, предназначено для того, чтобы обработчик формы мог его идентифицировать.

placeholderHTML5
Определяет короткую подсказку, которая описывает ожидаемое значение для текстового поля. Подсказка будет отображатся в текстовом поле, когда оно пустое, и исчезнет при получение им фокуса.

readonly
Устанавливает, что поле не может изменяться пользователем.

requiredHTML5
Указывает, что текстовое поле должно быть заполнено перед отправкой формы на сервер.

rows
Определяет видимое количество строк в текстовой области (в символах). Значение по умолчанию 2 символа.

wrapHTML5
Определяет параметры переноса строк в тексте, при отправке данных на сервер:
hard ‒ браузер автоматически вставляет разрывы строки так, что каждая строка не будет иметь ширину больше, чем ширина текстового поля. Обязательным условием использования значения hard является установленный атрибут cols.
soft ‒ текст отправляется одной сплошной строкой, дополнительные переносы строк не добавляются. Является значением по умолчанию.

Для этого элемента доступны глобальные атрибуты и события.

Стилизация по умолчанию

Нет.

Различия между HTML 4.01 и HTML5

В HTML5 тегу <textarea> были добавлены новые атрибуты.

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

Пример HTML: Попробуй сам
<form action="" method="POST">
<p>Ознакомьтесь с соглашеием:</p> 
  <textarea cols="24" rows="3" name="about" readonly>
  Условия нашего соглашения…</textarea><br/>
<p>Ваше мнение о этом соглашении:</p>
  <textarea name="comments" cols="24" rows="4">
  Введите свой комментарий…</textarea>
</form>

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

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

Элемент
<textarea> 3+ 1+ 3.5+ 1+ 1+ 1+
Элемент
<textarea> 1+ 1+ 6+ 1+

Учебник HTML

HTML уроки: Элементы формы

HTML Элементы



HTML-тег textarea


Пример

Элемент управления вводом многострочного текста (текстовая область):

Обзор W3Schools:

Попробуй сам »

Дополнительные примеры «Попробуйте сами» ниже.


Определение и использование

Тег


Попробуй сам »

Связанные страницы

Ссылка на HTML DOM: объект Textarea

Учебное пособие по CSS: стилизация форм


Настройки CSS по умолчанию

Нет.



Вот что вам следует знать »

Раскрытие информации: Ваша поддержка помогает поддерживать работу сайта! Мы зарабатываем реферальный сбор за некоторые услуги, которые мы рекомендуем на этой странице.Узнать больше
Что делает HTML5 Textarea Attributes: вот что вы должны знать, что делает?
Элемент

Для чего используется

< p> Эта текстовая область предназначена только для чтения и не может быть изменена

Если мы соединим эти элементы textarea с простой скрипт и элемент кнопки, мы получаем следующую форму:

Адам — ​​технический писатель, специализирующийся на документации и руководствах для разработчиков.Атрибуты

HTML5 Textarea Атрибуты: вот что вы должны знать

HTML Textarea: Пошаговое руководство | Карьера Карма

Тег textarea HTML используется для создания поля ввода текста с несколькими строками в форме. Он определяется тегом

Давайте разберемся с нашим кодом. Тег ).Это связано с тем, что текст по умолчанию, отображаемый в текстовой области, содержится между двумя тегами.

В нашем примере мы также указали два атрибута:

  • строки указывает браузеру, сколько строк должно быть в текстовой области по умолчанию. Другими словами, атрибут rows указывает высоту текстового поля.
  • cols — количество столбцов, которое должна иметь текстовая область по умолчанию. Другими словами, атрибут cols определяет ширину текстового поля.

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

Наш код возвращает:

Давайте разберемся с нашим кодом. Сначала мы объявили тег

, который используется для определения нашей веб-формы. Затем мы использовали тег , чтобы добавить метку на нашу страницу, спрашивая пользователя Какой отзыв у вас есть для нас?

Затем мы использовали тег

Наша форма возвращает:

В нашей форме нет видимых изменений, но если мы попытаемся отправить нашу форму, содержимое формы будет считаться недействительным, если пользователь ввел более 1000 символов.

Важно отметить, что даже если пользователь напишет в нашей форме менее 10 символов, текстовое поле все равно будет считаться действительным. Если мы хотим установить минимальный предел, нам нужно указать атрибут required .

Текст-заполнитель

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

Если вы хотите указать значение заполнителя, вы можете использовать атрибут заполнитель . Этот атрибут указывает значение заполнителя, которое отображается, когда форма пуста. Как только пользователь начинает вводить текст в поле, заполнитель исчезает.

Вот пример

Наш код возвращает:

Как видите, здесь находится текст Ваш отзыв. появится в текстовом поле. Однако, когда пользователь начинает печатать, этот текст исчезает. Мы знаем, что этот текст является заполнителем, потому что он светло-серого цвета, тогда как текст по умолчанию, как мы указали в нашем первом примере в этой статье, отображается полностью черным текстом (если не указано иное).

Атрибуты текстовой области HTML

Тег

Атрибуты

HTML-теги могут содержать один или несколько атрибутов. Атрибуты добавляются к тегу, чтобы предоставить браузеру дополнительную информацию о том, как тег должен выглядеть или вести себя.Атрибуты состоят из имени и значения, разделенных знаком равенства (=), а значение заключено в двойные кавычки. Вот пример: style = "color: black;" .

Есть 3 вида атрибутов, которые вы можете добавлять в свои HTML-теги: специфичные для элемента, глобальные атрибуты и атрибуты содержимого обработчика событий.

Атрибуты, которые вы можете добавить к этому тегу, перечислены ниже.

Атрибуты, зависящие от элемента

В следующей таблице показаны атрибуты, относящиеся к этому тегу / элементу.

Атрибут Описание
автозаполнение Указывает, должны ли поля формы автоматически заполняться на основе истории пользователя (т. Е. На основе предыдущих форм, которые пользователь заполнил). Это избавляет пользователя от необходимости повторно вводить данные формы, которые можно было бы легко повторно заполнить из предыдущей истории формы (например, информацию об адресе). Атрибут автозаполнения — это перечисляемый атрибут, который имеет два состояния; «включить и выключить».Значение по умолчанию — «включено».

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

, от которого произошел этот элемент, либо < form> , который этот элемент указал в своем атрибуте form ).

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

Это логический атрибут. Если атрибут присутствует, его значение должно быть либо пустой строкой, либо значением, которое является нечувствительным к регистру ASCII соответствием каноническому имени атрибута, без начальных или конечных пробелов (например, autofocus или autofocus = "autofocus" ).

Возможные значения:

отключено Отключает управление.Элемент управления не принимает изменения от пользователя. Он также не может получить фокус и будет пропущен при переходе по табуляции.

Это логический атрибут. Если атрибут присутствует, его значение должно быть либо пустой строкой, либо значением, которое является нечувствительным к регистру ASCII соответствием каноническому имени атрибута, без начальных или конечных пробелов (то есть отключено или отключено = "отключено" ).

Возможные значения:

dirname Определяет направление текста, представленного в поле textarea .Значением этого атрибута может быть строка текста, например имя поля. Например, если вы укажете атрибут как dirname = "text_dir" , после отправки формы данные могут выглядеть следующим образом: text_dir = ltr .
form Задает идентификатор формы, к которой принадлежит этот элемент управления.

Возможные значения:

[ID элемента формы в владельце элемента Документ ]

maxlength Задает максимальное количество символов, которое пользователь может ввести в элемент управления textarea.
minlength Задает минимальное количество символов, которое пользователь может ввести в элемент управления textarea.
имя Присваивает имя элементу управления вводом.
заполнитель Предоставляет пользователю подсказку, чтобы помочь ему заполнить текстовое поле. Например, это может быть образец текста или описание ожидаемого формата.
только для чтения Устанавливает элемент управления вводом только для чтения — он не позволяет пользователю изменять значение.Однако элемент управления может получать фокус и включается при переходе с помощью табуляции через элементы управления формы.

Это логический атрибут. Если атрибут присутствует, его значение должно быть либо пустой строкой, либо значением, которое является нечувствительным к регистру ASCII соответствием каноническому имени атрибута, без начальных или конечных пробелов (т.е. readonly или readonly = "readonly" ).

Возможные значения:

требуется Указывает, что поле ввода является обязательным полем (пользователь должен заполнить это поле).

Это логический атрибут. Если атрибут присутствует, его значение должно быть либо пустой строкой, либо значением, которое является нечувствительным к регистру ASCII совпадением для канонического имени атрибута, без начальных или конечных пробелов (т.е. требуется , или required = "required" ).

Возможные значения:

строк Задает высоту
столбцов

Ширина элемента управления, выраженная в количестве символов.

Ширина этого элемента рассчитывается исходя из ширины символов текущего шрифта. Поскольку символы не всегда имеют одинаковую ширину, браузеры могут использовать разные методы для аппроксимации этого значения (например, среднее или максимальное).

Значение, указанное в этом атрибуте, должно быть целым числом больше нуля. Если значение отсутствует или имеет неправильный формат, атрибут примет значение по умолчанию 20.

Пример

  
  

Особая благодарность:

имя каталога

Имя нового поля, специально созданного для передачи направленности вводимого текста.Этот атрибут, новый в HTML 5, позволяет авторам правильно обрабатывать значения, отправленные с любой направленностью текста, путем добавления поля, отправляемого вместе с формой. Имя этого поля будет значением этого атрибута.

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

Пример

  

Поделитесь идеей:

отключен

Логическое значение, указывающее, отключен ли элемент управления. Если атрибут принимает значение «отключен» или пустую строку («»), или если он просто присутствует, элемент управления будет отключен.

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

Пример

  

Пенни за мысли:

форма

Значение атрибута id формы, с которой связан этот элемент управления.

Этот атрибут является новым в HTML 5 и помогает определять принадлежность элементов управления во вложенных или удаленных формах.

Пример

  

Введение:

макс. Длина

Целое число, указывающее максимальное количество символов, которое может иметь значение этого элемента управления.

Авторам не следует полагаться на атрибут maxlength . Пользователи всегда могут отправить форму , если браузеры (некоторые намеренно) не поддерживают эту функцию.

Пример

  

Ресурсы:

мин. Длина

Целое число, указывающее минимальное количество символов, которое может иметь значение этого элемента управления.

Авторам не следует полагаться на атрибут minlength . Пользователи всегда могут отправить форму , если браузеры (некоторые намеренно) не поддерживают эту функцию.

Браузер поддерживает атрибут minlength на очень низком уровне (по состоянию на 2014/12/18). Авторам не следует полагаться на этот атрибут, пока поддержка не возрастет.

Пример

  

Анализ:

название

Имя элемента управления.Это имя будет отправлено браузером агенту обработки вместе с содержимым элемента. Оба значения вместе будут соответствовать паре имя-значение, которая будет использоваться для обработки данных формы.

В настоящее время значение isindex , ранее использовавшееся особым образом в некоторых браузерах и включенное в стандарт HTML , в этом атрибуте не допускается.

Пример

  

Обзор:

заполнитель

Отрывок текста, который должен дать подсказку о том, как следует заполнять поле, например примеры или краткие описания. Браузеры могут отображать содержимое этого атрибута в элементе управления, пока он не имеет значения.Как только пользователи начнут записывать свой собственный текст, заполнитель текст должен исчезнуть из элемента управления.

Пример

  

Результаты:

только чтение

Логическое значение, указывающее браузеру запретить пользователю изменять значение элемента управления.Если этот атрибут имеет значение «только для чтения» или пустую строку («»), или если он просто присутствует, пользователю не будет разрешено изменять значение в элементе управления.

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

Пример

  

Файл "config.cfg ":

требуется

Логическое значение, указывающее, можно ли оставить этот элемент пустым или нет. Если этот атрибут имеет значение «required» или пустую строку («»), или если он просто присутствует, пользователь должен будет заполнить элемент управления, чтобы иметь возможность отправить форму .

Если элемент управления с обязательным атрибутом оставлен пустым, поддерживающие браузеры выдадут ошибку при отправке и немедленно отменит процесс.

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

Пример

  

Оставьте свое мнение:

рядов

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

Значение, указанное в этом атрибуте, должно быть целым числом больше нуля. Если значение отсутствует или имеет неправильный формат, атрибут примет значение по умолчанию 2.

Пример

  

Особая благодарность:

упаковка

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

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

Если атрибут wrap определен со значением « hard », наличие атрибута cols является обязательным.

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

Пример

  

Список кодов:

HTML-тег

Тег ) тегами.

Чтобы определить размер текстового поля, используйте атрибуты rows и cols или свойства высоты и ширины CSS.

Пример HTML-тега


Попробуйте сами »

Результат¶

В этом примере мы используем
Попробуйте сами »

В этом примере мы используем стили CSS для настройки внешнего вида текстового поля.

Атрибуты¶

Тег

Проверить это сейчас

Выход:

Пример тега текстовой области JavaTpoint со строками и столбцами.

Поддерживающие браузеры


Новые атрибуты HTML 5 Textarea

Атрибут Описание
автофокус Он указывает, что текстовая область должна автоматически фокусироваться при загрузке страницы.
form Определяет одну или несколько форм, которым принадлежит текстовое поле.
maxlength Определяет максимальное количество символов, разрешенное в текстовой области.
заполнитель Он указывает короткую подсказку, которая описывает ожидаемое значение текстового поля.
требуется Указывает, что текстовое поле должно быть заполнено.
wrap Он определяет, как тексты в текстовой области упаковываются во время отправки формы.

Атрибут формы HTML Textarea

Атрибут формы определяет одну или несколько форм, к которым принадлежит текстовая область.

Имя:

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

Примечание. Атрибут формы не поддерживается в Internet Explorer.

Проверить это сейчас

Выход:


Введите текст здесь .

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *