HTML <textarea> 标签用于表示多行纯文本编辑控件。当您希望允许用户输入大量自由格式文本时，它很有用。<textarea> 标签的最佳示例是对评论、反馈表和故事内容撰写评论。
以下是创建 <textarea> 标签时自动添加的默认属性，如下所示 -
- id：它允许 <textarea> 标签与标签元素相关联，以实现可访问性目的。
- name：它用于设置提交from时提交给服务器的关联数据点的名称。
- rows & cols：HTML 行和列属性指定 <textarea> 的确切大小。
语法
<textarea> .... </textarea>
属性
<textarea> 标签支持 HTML 的 全局属性 和 事件属性。以及下面列出的一些特定属性。
<textarea> 标签示例
下面的示例将说明 <textarea> 标签的用法。在哪里、何时以及如何使用它来创建 textarea，以及我们如何使用 CSS 设置该 textarea 部分的样式。
创建 <textarea> 标签元素
在下面的程序中，我们使用 <textarea> 标签在 HTML 中创建一个不包含任何属性的 textarea 字段。
<!DOCTYPE html>
<html lang="en">
<head>
<title>HTML Textarea Tag</title>
</head>
<body>
<!--create a textarea element(tag)-->
<textarea></textarea>
</body>
</html>
创建具有属性的<textarea> 标签
以下是 <textarea> 标签的另一个示例。在这里，我们使用 <textarea> 标签创建一个 textarea 元素，其中包含默认属性：name、id、row 和 cols。
<!DOCTYPE html>
<html lang="en">
<head>
<title>HTML Textarea Tag</title>
</head>
<body>
<!--create a textarea element(tag)-->
<textarea name="feedback" id="demo"
cols="30" rows="10">
</textarea>
</body>
</html>
设置<textarea> 标签CSS样式
在此示例中，我们将使用 HTML <textarea> 标签创建一个 textarea 元素。然后，使用 CSS 对其进行样式设置，并使用占位符属性在 textarea 中指定值的简短提示。
<!DOCTYPE html>
<html lang="en">
<head>
<title>HTML Textarea Tag</title>
<style>
textarea {
width: 300px;
height: 120px;
background-color: aquamarine;
padding: 10px 10px;
font-size: 18px;
color: white;
}
</style>
</head>
<body>
<!--create a textarea element(tag)-->
<h3>Write your feedback: </h3>
<textarea placeholder="Write your feedback...."></textarea>
</body>
</html>
<textarea> 标签字符限制
考虑以下示例，我们将在其中使用 min 和 max 属性。
<!DOCTYPE html>
<html lang="en">
<head>
<title>HTML Textarea Tag</title>
<style>
textarea {
width: 350px;
height: 120px;
background-color: rgb(222, 216, 216);
font-size: 18px;
padding: 10px 10px;
}
</style>
</head>
<body>
<!--create a textarea element(tag)-->
<p>
Write your review minimum of 10 characters
and a maximum of 20 characters:
</p>
<textarea placeholder="Write your review..."
minlength="10" maxlength="20">
</textarea>
</body>
</html>
禁用文本区域
让我们看一下下面的示例，我们将在其中使用 disabled 属性。
<!DOCTYPE html>
<html lang="en">
<head>
<title>HTML Textarea Tag</title>
<style>
textarea {
width: 300px;
height: 100px;
background-color: rgb(22, 208, 236);
font-size: 18px;
padding: 5px 5px;
color: white;
}
</style>
</head>
<body>
<!--create a textarea element(tag)-->
<p>Your short story here: </p>
<textarea placeholder="Your story..." name='story' disabled>
</textarea>
</body>
</html>
支持的浏览器
| 浏览器 |  |
 |
 |
 |
 |
|---|---|---|---|---|---|
| <textarea> | Yes | Yes | Yes | Yes | Yes |
