HTML <textarea> Tag
HTML
The <textarea> tag creates a multi-line plain-text input control.
HTML <textarea> Tag
The <textarea> element represents a multi-line text editing control.
This control is useful as it allows users to enter any amount of plain-text, for review or feedback in an html forms.
The width and height of <textarea> element can be setup using the cols and rows attributes.
Element Attributes
| Attribute | Value | Description |
|---|---|---|
autofocus |
autofocus | This specifies that a text area should automatically focus when the page is loaded. |
cols |
number | This specifies the width of the text area. |
dirname |
textareaname.dir | This specifies the text direction of the Textarea when submitting the form. |
disabled |
disabled | This specifies that a text area should be disabled. |
form |
form_id | Specifies which form the text area belongs to. |
maxlength |
number | This specifies the maximum number of characters allowed in the text area. |
name |
name | It specifies the name of the text area. |
placeholder |
text | It specifies the hint to the user of what can be entered in the text area. |
readonly |
readonly | Specifies the text area should be read-only. |
required |
required | Specifies that the user must fill in a value in the text area before submitting a form. |
rows |
number | This specifies the height of the text area. |
wrap |
hard soft |
This specifies how the text area wraps text. |
Global attributes
Global attributes may be applied on all elements, although some elements may have no effect on them.
<accesskey>,
<class>,
<contenteditable>,
<contextmenu>,
<data-*>,
<dir>,
<draggable>,
<dropzone>,
<hidden>,
<id>,
<lang>,
<spellcheck>,
<style>,
<tabindex>,
<title>,
<translate>.
Global Event Handler Attributes
Global Event Handler attributes may be applied on all elements, although some elements may have no effect on them.
<onabort>,
<onautocomplete>,
<onautocompleteerror>,
<onblur>,
<oncancel>,
<oncanplay>,
<oncanplaythrough>,
<onchange>,
<onclick>,
<onclose>,
<oncontextmenu>,
<oncuechange>,
<ondblclick>,
<ondrag>,
<ondragend>,
<ondragenter>,
<ondragleave>,
<ondragover>,
<ondragstart>,
<ondrop>,
<ondurationchange>,
<onemptied>,
<onended>,
<onerror>,
<onfocus>,
<oninput>,
<oninvalid>,
<onkeydown>,
<onkeypress>,
<onkeyup>,
<onload>,
<onloadeddata>,
<onloadedmetadata>,
<onloadstart>,
<onmousedown>,
<onmouseenter>,
<onmouseleave>,
<onmousemove>,
<onmouseout>,
<onmouseover>,
<onmouseup>,
<onmousewheel>,
<onpause>,
<onplay>,
<onplaying>,
<onprogress>,
<onratechange>,
<onreset>,
<onresize>,
<onscroll>,
<onseeked>,
<onseeking>,
<onselect>,
<onshow>,
<onsort>,
<onstalled>,
<onsubmit>,
<onsuspend>,
<ontimeupdate>,
<ontoggle>,
<onvolumechange>,
<onwaiting>.
Learning with HTML Editor "Try it Now"
You can edit the HTML code and view the result using online editor.
Example
<form action="actionpage.jsp">
<table>
<tr>
<td><label for="fname">Full Name:</label></td>
<td><input type="text" id="fname" name="fname" placeholder="Write your name here."></td>
</tr>
<tr>
<td><label for="email">Email:</label></td>
<td><input type="email" id="email" name="email" placeholder="Write your email here."></td>
</tr>
<tr>
<td>Details:</td>
<td><textarea rows="10" cols="20" id="details" name="details"
placeholder="Write your feedback here."></textarea></td>
</tr>
<tr>
<td></td>
<td><input type="submit" value="Submit"></td>
</tr>
</table>
</form>Click on the "Try it Now" button to see how it works.