The HTML <textarea>
tag is used to create a multi-line text input field in a web page. It allows users to enter and edit multiple lines of text in a form. The <textarea>
tag is a self-closing tag, which means it does not require a closing tag.
The <textarea>
tag has several attributes that can be used to customize the appearance and behavior of the text input field. The most commonly used attributes are:
name
: Specifies the name of the text input field.rows
: Specifies the number of rows (lines) of text that should be visible in the input field.cols
: Specifies the number of columns (characters) of text that should be visible in the input field.placeholder
: Specifies a short hint that describes the expected value of the input field.readonly
: Specifies that the input field is read-only and cannot be edited by the user.disabled
: Specifies that the input field is disabled and cannot be used by the user.Here is an example of how to use the <textarea>
tag:
<form> <label for="message">Enter your message:</label> <textarea id="message" name="message" rows="5" cols="30"></textarea> </form>
In this example, we have created a form with a label and a <textarea>
input field. The id
and name
attributes are set to "message", which is the name of the input field. The rows
and cols
attributes are set to 5 and 30, respectively, which means that the input field will display 5 rows and 30 columns of text. The </textarea>
tag is left empty, which means that the input field will be initially empty.
Here are some additional examples of how to use the <textarea>
tag with different attributes:
<form> <label for="username">Enter your username:</label> <input type="text" id="username" name="username" placeholder="Enter your username"> <br><br> <label for="password">Enter your password:</label> <input type="password" id="password" name="password" placeholder="Enter your password"> <br><br> <label for="message">Enter your message:</label> <textarea id="message" name="message" rows="5" cols="30" placeholder="Enter your message"></textarea> </form>
In this example, we have added the placeholder
attribute to the <textarea>
tag, which displays a short hint that describes the expected value of the input field. This can be useful for providing additional guidance to the user.
<form> <label for="message">Enter your message:</label> <textarea id="message" name="message" rows="5" cols="30" readonly>This input field is read-only.</textarea> </form>
In this example, we have added the readonly
attribute to the <textarea>
tag, which makes the input field read-only and prevents the user from editing the text. This can be useful for displaying information that the user cannot change.
<form> <label for="message">Enter your message:</label> <textarea id="message" name="message" rows="5" cols="30" disabled></textarea> </form>
In this example, we have added the disabled
attribute to the <textarea>
tag, which disables the input field and prevents the user from using it. This can be useful for temporarily disabling an input field while other parts of the form are being filled out.
The <textarea>
tag is a versatile HTML tag that allows users to enter and edit multiple lines of text in a form. It has several attributes that can be used to customize the appearance and behavior of the input field, including the name
, rows
, cols
, placeholder
, readonly
, and disabled
attributes. By using the <textarea>
tag, web developers can create more user-friendly and interactive forms that allow users to enter and edit text more easily.