返回

HTML篇八——(2)

发布时间:2022-10-01 06:10:49 282
# html# edge

一、表单标签

本文接​​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"时,当前项即为默认选中项。 代码示例:


<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>

特别声明:以上内容(图片及文字)均为互联网收集或者用户上传发布,本站仅提供信息存储服务!如有侵权或有涉及法律问题请联系我们。
举报
评论区(0)
按点赞数排序
用户头像
精选文章
thumb 中国研究员首次曝光美国国安局顶级后门—“方程式组织”
thumb 俄乌线上战争,网络攻击弥漫着数字硝烟
thumb 从网络安全角度了解俄罗斯入侵乌克兰的相关事件时间线
下一篇
移动Web开发入门(七) -- 移动端调试 2022-10-01 05:31:48