The <textarea> tag is used to create a multi-line text input. Unlike other input tags, the textarea tag have closing tags.
Syntax
<textarea>text</textarea>
Example
<!DOCTYPE html>
<html>
<head>
<title>HTML textarea</title>
</head>
<body>
<textarea rows="5" cols="50" placeholder="Type something here">
</textarea>
</body>
</html>
Output
Attribute
Textarea supports HTML Global Attributes.
Attribute | Description |
autofocus | Specifies whether the element should get focused after loading the page. |
autocomplete | Specifies whether the value of the element can be automatically completed by the browser based on the previous inputs. |
cols | Specifies the width (characters) of the text area. The default value is 20. |
disabled | Indicates that the element should not be enabled. If disabled, user cannot interact with the element. |
form | Specifies the form which the textarea belongs to. |
maxlength | Specifies the maximum number of characters that the user can enter. |
name | Specifies the name of the element. |
placeholder | Specifies the hint to be displayed. |
readonly | Specifies whether the user can modify the value of the control. Unlike the disabled attribute, the readonly attribute does not prevent the user from clicking or selecting in the control. |
requried | Specifies whether the user should fill the element before submitting the form. |
rows | Specifies the number of rows (lines) of the element. |
wrap | Specifies how the text entered in the textarea should be wrapped. It can have the following values: ->hard - The browser automatically inserts line-breaks to keep the length of the line below the width of the element. ->soft - The browser ensures that all line breaks in the value consist of a CR+LF pair. ->off - This is the default value. The lines exceeding the width of the element are not wrapped and the element becomes horizontally scrollable. |
Example
<form action="#" id="myform">
<textarea name="txt" maxlength="5" placeholder="You can enter more than 5 characters here" required>
</textarea>
<button>Try saving without filling a textarea</button>
</form>
<textarea name="txt1" form="myform" placeholder="You cannot leave this field empty." required>
</textarea>