HTML textarea 语法
在 HTML 中，textarea 标签用于定义一个多行文本框。多行文本框可以方便用户输入多行文本，它通常用于收集用户的评论、反馈、文章等。
语法：
<textarea rows="行数" cols="列数"></textarea>说明：
对于 textarea 标签来说，它常用的属性如下表所示。
| 属性 | 说明 |
|---|---|
| name | 设置文本框的名称，用于提交表单时使用 |
| form | 设置文本框所属的表单 ID |
| rows | 设置文本框的行数（以行数为单位），默认值为 2 |
| cols | 设置文本框的列数（以字符为单位），默认值为 20 |
| wrap | 设置文本框的换行方式，如 normal、nowrap 或 hard |
| maxlength | 设置可输入的最大字符数 |
| minlength | 设置可输入的最小字符数 |
| readonly | 设置文本框是否 “只读” |
| required | 设置文本框是否 “必填” |
| disabled | 设置文本框是否 “禁用” |
| autofocus | 设置文本框是否自动获取焦点 |
| placeholder | 设置文本框的提示文字 |
HTML textarea 摘要
| 属于 | HTML 文本框 |
|---|---|
| 使用频率 | 高 |
| 兼容性 | 查看 |
| 官方文档 | 查看 |
| MDN | 查看 |
HTML textarea 示例
接下来，我们通过几个简单的例子来讲解一下 HTML textarea 标签是如何使用的。
示例 1：textarea 标签的基本使用
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<form method="post" action="/">
<label>个人简介：<textarea rows="5" cols="20" name="intro"></textarea></label>
</form>
</body>
</html>页面效果如下图所示。
分析：
textarea 标签会生成一个多行文本框，它的右下角有一个小三角。拖拽该小三角，可以改变多行文本框的大小。如果想要禁止用户拖拽改变大小，我们可以使用 CSS 的 resize: none; 来设置，这是一个非常有用的技巧。
示例 2：textarea 的属性
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<form method="post" action="/">
<label for="message">消息：</label>
<p><textarea name="message" id="message" cols="40" rows="10" autofocus placeholder="请输入您的消息"></textarea></p>
<input type="submit" value="提交">
</form>
</body>
</html>页面效果如下图所示。
