HTML篇八——（2）

lewis 1年前 (2024-03-25) 阅读数 7 #技术

一、表单标签

本文接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>

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>

版权声明

本文仅代表作者观点，不代表博信信息网立场。

上一篇：如何配置linux系统？下一篇：linux怎么查询mysql端口

HTML篇八——（2）

版权声明

作者文章