HTML select 下拉表单 textarea 文本域元素

最新推荐文章于 2023-02-22 22:20:32 发布

CodeDoraemon

最新推荐文章于 2023-02-22 22:20:32 发布

阅读量731

点赞数

分类专栏： HTML

本文链接：https://blog.csdn.net/qq_40417070/article/details/113144152

版权

HTML 专栏收录该内容

27 篇文章 1 订阅

订阅专栏

title : HTML select 下拉表单 textarea 文本域元素

select

1. select 下拉菜单

应用场景：需要有一个下拉选项
有多个选项让用户选择，节约页面空间，使用 select 定义下拉列表
在这里插入图片描述

2. 代码示例

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <form>
    籍贯：
    <select>
        <option>山东</option>
        <!-- selected 有默认的选项配置 此处为北京 -->
        <option selected = "selectedd">北京</option>
        <option>上海</option>
        <option>广州</option>
    </select>
</form>
</body>
</html>

3. 运行结果

在这里插入图片描述

textarea

1. textarea 表单元素文本域

应用在比如网站介绍的部分，比如网页的留言，网站介绍，评论等工作
在这里插入图片描述

2. 代码示例

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <form>
    籍贯：
        <select>
            <option>山东</option>
             <!-- selected 有默认的选项配置 此处为北京 -->
             <option selected = "selectedd">北京</option>
             <option>上海</option>
             <option>广州</option>
        </select><br>
        今日反馈：<br>
            <!-- 一行 50 字；可以写 5 行  -->
            <textarea cols="50" rows="10">
                请输入今天的反馈
            </textarea>
    </form>
</body>
</html>