一、表单标签

本文接​​https://editor.csdn.net/md/?articleId=127037012​

2.表单控件 (表单元素)

2.2.4 ​​<select>​​表单元素

使用场景:在页面中,如果有多个选项让用户选择,并且想要节约页面空间时,可以使用​​<select>​​标签控件定义下拉列表

基本语法规范:

<select>
<option>选项1</option>
<option>选项2</option>
<option>选项3</option>
···
</select>

注意:

1.​​<select>​​​中至少包含一对​​<option>​​​

2.在​​​<option>​​中定义selected="selected"时,当前项即为默认选中项。 代码示例:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>select下拉表单元素</title>
</head>
<body>
请选择您所在省份:
<select>
<option>请选择</option>
<option>四川</option>
<option>西藏</option>
<option>广东</option>
<option>江苏</option>
<option>江西</option>
<option>陕西</option>
<option selected="selected">黑龙江</option>
<option>新疆</option>
</select>
</body>
</html>

HTML篇八——(2)_表单

HTML篇八——(2)_html_02

2.2.5 ​​<textarea>​​表单元素

使用场景:当用户输入内容较多的情况下,我们不能使用文本框表单了,此时我们可以使用​​<textarea>​​​标签控件定义。在表单元素中,​​<textarea>​​标签是用于定义多行文本输入的控件。

使用多行文本输入的控件,可以输入更多的文字,该控件常见于留言本,评论。

基本语法规范:

<textarea rows="3" cols="20">
文本内容
</textarea>

注意:

1.通过​​<textarea>​​标签可以轻松地创建多行文本输入框。

2.cols="每行中的字符数",rows="显示的行数"在实际开发中不会使用,都是用CSS来改变大小

代码示例:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>textarea标签学习</title>
</head>
<body>
<form>
请输入您的意见或建议:
<textarea cols="20" rows="5">你希望升职加薪嘛???</textarea>
</form>
</body>
</html>

HTML篇八——(2)_html_03