零基础HTML入门教程(18)——表单传输文件和下拉菜单

程序员大宁

已于 2022-12-07 13:44:30 修改

阅读量146

点赞数 1

分类专栏： HTML篇文章标签： html css 前端

于 2022-12-06 18:32:57 首次发布

本文链接：https://blog.csdn.net/weixin_61808806/article/details/128208044

版权

HTML篇专栏收录该内容

23 篇文章 0 订阅

订阅专栏

本章目录

1.任务目标

我们上一小结学习了单选框和复选框，我们这一小节学习一下，传输文件和下拉菜单，并熟练使用。

2.传输文件file

代码如下

<!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>Document</title>
</head>

<body>
  <form action="#" method="get">
    <b>请保存你的文件</b>
        <br>
         <!--inout typr="file"他表示 向上面传输文件，在后面加上 multipe可以传输多个文件。-->
        <input type="file" multiple>
        <br>
        <br>
</html>

效果如下
在这里插入图片描述

3.下拉框select

代码如下

<!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>Document</title>
</head>

<body>
  <form action="#" method="get">
    <b>请选择你的地区</b>
    <br>
    <!--select下拉菜单整体一般用于写城市和地区，option在下拉菜单里面写内容。-->
    <select>
        <!-- <option>北京</option> -->
        <option selected>上海</option> <!--selected他是在select里面用的代表默认值-->
        <option><a href="https://www.baidu.com/">南京</a></option>
        <option><a href="http://test.pandabrother.cn/gpracticef/my/login.html">北京</a></option>
        <option>山东</option>
        <option>武汉</option>
        <option>重庆</option>
        <option>厦门</option>
        <option>云南</option>

    </select>
  </form>
</html>

效果如下

在这里插入图片描述

4.小结

本小结我们讲述了下拉框，上传文件，这些功能我们已经很常见了，我们报名时候下拉框很常见，我们学会熟练使用。

程序员大宁

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
零基础HTML入门教程(18)——表单传输文件和下拉菜单

我们上一小结学习了单选框和复选框，我们这一小节学习一下，传输文件和下拉菜单，并熟练使用。代码如下效果如下代码如下效果如下本小结我们讲述了下拉框，上传文件，这些功能我们已经很常见了，我们报名时候下拉框很常见，我们学会熟练使用。
复制链接

扫一扫