View video tutorial

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>.

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>
Try it Now »

Click on the "Try it Now" button to see how it works.