Working with the Textarea Element for Multi-line Input
The <textarea> element is a powerful tool for creating a multi-line text input field on a web page. It allows users to input and submit more significant amounts of text than the <input> element, which is limited to a single line of text.
<textarea></textarea>
The <textarea> element consists of an opening <textarea> tag and a closing </textarea> tag. Any text placed between these tags will serve as the default value for the text area.
Attributes
name: specifies the name of the text area, which is used to identify the field when the form is submitted.
<textarea name="feedback"></textarea>
rows and cols: determine the number of visible rows and columns of the text area, respectively. They allow us to specify the width and height of the text area.
<textarea name="feedback" rows="3" cols="30"></textarea>
placeholder: provides a short hint to the user about the expected information in the text area. It is displayed as a temporary placeholder until the user starts typing.
<textarea name="feedback" placeholder="Leave your opinion"></textarea>
maxlength: specifies the maximum number of characters that can be entered in the text area. It helps enforce character limits or restrictions.
<textarea name="feedback" maxlength="200"></textarea>
readonly: readonly attribute, when added to the <textarea> element, makes the field read-only, preventing users from modifying the text. It is useful when displaying pre-filled or non-editable content.
<textarea name="feedback" readonly>This content is read only.</textarea>
Example
index.html
1. Which attribute is used to set the maximum number of characters allowed in a text input field?
2. Which element is used to create a multi-line input field?
Thanks for your feedback!
Ask AI
Ask AI
Ask anything or try one of the suggested questions to begin our chat
Can you show me a complete example using all these attributes?
What are some common use cases for the `<textarea>` element?
How do I style a `<textarea>` with CSS?
Awesome!
Completion rate improved to 2.56
Working with the Textarea Element for Multi-line Input
Swipe to show menu
The <textarea> element is a powerful tool for creating a multi-line text input field on a web page. It allows users to input and submit more significant amounts of text than the <input> element, which is limited to a single line of text.
<textarea></textarea>
The <textarea> element consists of an opening <textarea> tag and a closing </textarea> tag. Any text placed between these tags will serve as the default value for the text area.
Attributes
name: specifies the name of the text area, which is used to identify the field when the form is submitted.
<textarea name="feedback"></textarea>
rows and cols: determine the number of visible rows and columns of the text area, respectively. They allow us to specify the width and height of the text area.
<textarea name="feedback" rows="3" cols="30"></textarea>
placeholder: provides a short hint to the user about the expected information in the text area. It is displayed as a temporary placeholder until the user starts typing.
<textarea name="feedback" placeholder="Leave your opinion"></textarea>
maxlength: specifies the maximum number of characters that can be entered in the text area. It helps enforce character limits or restrictions.
<textarea name="feedback" maxlength="200"></textarea>
readonly: readonly attribute, when added to the <textarea> element, makes the field read-only, preventing users from modifying the text. It is useful when displaying pre-filled or non-editable content.
<textarea name="feedback" readonly>This content is read only.</textarea>
Example
index.html
1. Which attribute is used to set the maximum number of characters allowed in a text input field?
2. Which element is used to create a multi-line input field?
Thanks for your feedback!