What does <textarea> do and when should you use it?
The <textarea> element is used for multi-line text input: comments, reviews, messages, descriptions and any other data that does not fit into one short <input> field.
Unlike <input type="text">, which is meant for a single line, <textarea> lets the user write several lines of text and even use line breaks.
1. Basic usage example
<form action="/feedback" method="post">
<label for="message">Your review:</label><br>
<textarea id="message" name="message" rows="4" cols="40" placeholder="Write here..."></textarea>
<br>
<button type="submit">Submit</button>
</form>Result: a large text field appears where you can write a multi-line message.
2. Main
Attribute Purpose Example nameField name (key for sending data) name="comment"rowsNumber of visible rows rows="5"colsField width in characters cols="40"placeholderHint inside the field placeholder="Enter your message..."maxlengthMaximum number of characters maxlength="500"requiredMakes the field mandatory requiredreadonlyRead-only (cannot be edited) readonlydisabledDisables the field (inactive) disabledwrapControls line wrapping (soft or hard) wrap="soft"
| Attribute | Purpose | Example |
|---|---|---|
name | Field name (key for sending data) | name="comment" |
rows | Number of visible rows | rows="5" |
cols | Field width in characters | cols="40" |
placeholder | Hint inside the field | placeholder="Enter your message..." |
maxlength | Maximum number of characters | maxlength="500" |
required | Makes the field mandatory | required |
readonly | Read-only (cannot be edited) | readonly |
disabled | Disables the field (inactive) | disabled |
wrap | Controls line wrapping (soft or hard) | wrap="soft" |
3. Difference from
| Criterion | <input type="text"> | <textarea> |
|---|---|---|
| Number of lines | Only one | Several |
| Line breaks | No | Yes |
| Size | Fixed | Can be resized (dragged with the mouse) |
| Purpose | Short data (name, email, login) | Long text (comment, message, description) |
Comparison example:
<input type="text" name="title" placeholder="Title">
<textarea name="description" placeholder="Description"></textarea>The first is for a short title, the second is for a long description.
4. Default value
The text between the opening and closing <textarea> tag is treated as the initial value:
<textarea name="text">Default text</textarea>5. How the data is sent
On form submission, the browser sends the content of <textarea> as the value tied to its name:
Example:
<textarea name="message">Hello!</textarea>The server receives:
message=Hello!6. When to use
Use it when you need to:
- collect a lot of text (a review, comment, letter, description);
- let the user enter line breaks;
- collect free-form content, rather than something limited to short fields.
Summary:
| Property | Value |
|---|---|
| Tag | <textarea> (paired) |
| Purpose | Multi-line input field |
| Key attributes | name, rows, cols, placeholder, maxlength |
Difference from <input> | Supports several lines and line breaks |
| Used for | Comments, messages, descriptions, feedback forms |
In simple terms:
<textarea> is a "notepad" inside the site, where a user can write out a longer text.
If <input> is a field for a "name",
then <textarea> is a field for a "thought".
Short Answer
Interview readyA concise answer to help you respond confidently on this topic during an interview.