Summary -
In this topic, we described about the <textarea> tag along with detailed example.
Multi-line plain text editor control in form of HTML documents. The <textarea> tag used to specify a multiline plain text edit control in an HTML <form>.
User can able to enter multiple lines of data by using <textarea> tag. The tag can be specified like <textarea></textarea> with any contents in between the opening and closing tags.
The text area can hold the unlimited number of characters. The content in the <textarea> element after initial page loading is the initial value of field.
Syntax -
<textarea>.... </textarea>
Optional Attributes -
| Attribute | Description | Values |
|---|---|---|
| autocomplete | Specifies the browser implement autocomplete or not. | on (default)off |
| autofocus | Specifies the text are should get focused on page loads.HTML5 attribute | autofocus |
| cols | Specifies the required characters number per line. | Number. Default value is 20. |
| dirname | Specifies the direction of the field while sending the data. | Text (no spaces). |
| disabled | Specifies the text area should be disabled. | None. |
| form | Specifies the text area associated form.HTML5 attribute | Form_id |
| maxlength | Specifies the max number of characters allowed in text area.HTML5 attribute | Number. |
| minlength | Specifies the min number of characters allowed in text area.HTML5 attribute | Number. |
| name | Specifies the textarea name. | Text (no spaces). |
| placeholder | Hint that specifies the what kind of data expecting as input in textarea.HTML5 attribute | text |
| readonly | Specifies text area is readonly. | Readonly |
| required | Specifies textare must be filled or data entered.HTML5 attribute | Required |
| rows | Specifies textarea visible number of rows. | Number. Default value is 2. |
| wrap | Specifies the text are data wrapping when the form is submitted. HTML5 attribute | soft (default)hard: Should be wrapped. |
Example -
<!DOCTYPE html>
<html>
<head>
<title>Textarea tag example.. </title>
</head>
<body>
<p>Enter text area input</p>
<textarea rows="5" cols="67">
text area….
</textarea>
</body>
</html>