1. TextArea概览
TextArea 是HTML表单中用来输入文本的一个区域,通常用于用户填写短信息、评论等。TextArea 号称“不会截断内容”,当然,这与文本输入的内容和浏览器窗口的大小有关。
2. TextArea 属性
cols和rows是TextArea的最基本属性,用于设置 TextArea 控件的列数和行数。
placeholder属性用于在TextArea内预填提示用户输入的信息。
readonly属性和disabled属性用于控制 TextArea是只读还是禁用。
maxlength属性用于控制TextArea内的输入字数上限,如果超出就不再允许输入。
// 示例代码
<textarea cols="30" rows="10" placeholder="请输入您的评论"></textarea>
<textarea cols="30" rows="10" readonly>只读文本区域</textarea>
<textarea cols="30" rows="10" disabled>禁用文本区域</textarea>
<textarea cols="30" rows="10" maxlength="100"></textarea>
3. TextArea 样式
TextArea可以通过CSS样式定制。
3.1 高度和宽度
TextArea的高度和宽度可以通过CSS样式定制。
textarea {
width: 100%;
height: auto;
}
3.2 边框和背景色
TextArea的边框和背景色也可以通过CSS样式定制。
textarea {
border: 1px solid #ccc;
background-color: #f7f7f7;
}
3.3 其他样式
TextArea还可以使用其他CSS样式,比如字体、行高、边框圆角、阴影等。
textarea {
font-family: '微软雅黑', sans-serif;
font-size: 16px;
line-height: 1.5;
border-radius: 5px;
box-shadow: 0 0 5px rgba(0,0,0,0.1);
}
4. 总结
TextArea是表单中常用的控件之一,可以根据不同的需求进行设置和定制。