006+limou+HTML——(6)HTML表单
创始人
2024-05-31 04:34:52
0

000、

表单和表格不一样,表单含有“文本框”、“按钮”、“单选框”、“复选框”、“下拉列表”等

(1)作用

用于声明一个表单,内部包含“文本框”、“按钮”、“单选框”、“复选框”、“下拉列表”等所有的表单标签。如果需要表单和服务器交互,则必须写,如果不用,其实也可以不写

(2)属性

在这里插入图片描述


网页标题

001、

(1)作用

在浏览器中显示供用户交互的表单

(2)属性[type]

在这里插入图片描述

(3)各个属性的应用

①单行文本框

  • 简单使用如下

网页标题
姓名:

在这里插入图片描述

  • 其本身也具有属性

在这里插入图片描述


网页标题
姓名:
姓名:

在这里插入图片描述

②密码文本框

  • 本身和单行文本框类似,但是其输入字符不可见,简单使用如下

网页标题
姓名:
姓名:
密码:

在这里插入图片描述

  • 拥有和单行文本框一样的属性

网页标题
姓名:
姓名:
密码:
密码:

在这里插入图片描述

③单选框

  • 其一般直接配合自己的属性[name]、[value]使用,单选是指:在同属于一个[name]的多个选项中选一个。如果忘记写[name],或者是不同一组name的情况下就会出现“多选”的情况

网页标题
姓名:
姓名:
密码:
密码:
性别:

在这里插入图片描述

  • 如果需要默认选择某一项,可以使用单选框自身的属性[checked],直接加在想要的单选框标签内部的最后面就可以,可以写成有属性值的形式,也可以直接简写(以下存在三类单选框,因为有三种name)

网页标题
姓名:
姓名:
密码:
密码:
性别:
性别:
性别:

在这里插入图片描述

  • 另外如果可以,请再写得规范些,在表单标签何后面的文本使用

网页标题
姓名:
姓名:
密码:
密码:
性别:
性别:
性别:

在这里插入图片描述

④多选框

  • 简单使用如下

网页标题
姓名:
姓名:
密码:
密码:
性别:
性别:
性别:
你喜欢的水果:苹果香蕉西瓜李子

在这里插入图片描述

  • 如果需要默认选择某一项,可以使用多选框自身的属性[checked],直接加在想要的多选框标签内部的最后面就可以,可以写成有属性值的形式,也可以直接简写

网页标题
姓名:
姓名:
密码:
密码:
性别:
性别:
性别:
你喜欢的水果:苹果香蕉西瓜李子

在这里插入图片描述

⑤按钮

  • 普通按钮,一般配合Javascript使用,这里可以不管下面代码的Javascript部分

网页标题
1.1.姓名:
1.2.姓名:
2.1.密码:
2.2.密码:
3.1.性别:
3.2.性别:
3.3.性别:
4.你喜欢的水果:苹果香蕉西瓜李子
5.按钮

在这里插入图片描述

  • 提交按钮和普通按钮外观没有什么区别,这个以后再了解,提交按钮主要是用来给服务器提交数据的

网页标题
1.1.姓名:
1.2.姓名:
2.1.密码:
2.2.密码:
3.1.性别:
3.2.性别:
3.3.性别:
4.你喜欢的水果:苹果香蕉西瓜李子
5.普通按钮
6.提交按钮

在这里插入图片描述

  • 重置按钮,用来清除用户的输入内容,不过只清楚一个表单标签
    中的内容

网页标题1.1.姓名:
1.2.姓名:
2.1.密码:
2.2.密码:
3.1.性别:
3.2.性别:
3.3.性别:
4.你喜欢的水果:苹果香蕉西瓜李子
5.普通按钮
6.提交按钮
账号:
密码:

⑥文件上传

  • 文件上传涉及较多的后端知识,这里就不细讲了。点击“选择文件”就会弹出文件选择窗口

网页标题
1.1.姓名:
1.2.姓名:
2.1.密码:
2.2.密码:
3.1.性别:
3.2.性别:
3.3.性别:
4.你喜欢的水果:苹果香蕉西瓜李子
5.普通按钮
6.提交按钮
账号:
密码:
7、文件上传

在这里插入图片描述

003、

在这里插入图片描述

004、

在这里插入图片描述

(2)属性

在这里插入图片描述


网页标题
个人简介

在这里插入图片描述

相关内容

热门资讯

峰米系统是安卓系统吗,揭秘安卓... 你有没有听说过峰米系统?最近这个话题在数码圈里可是挺火的。很多人都在问,峰米系统是安卓系统吗?今天,...
华为系统emui和安卓系统的区... 你有没有发现,手机的世界里,系统就像是它们的灵魂,决定了它们能跳得多高、飞得多远。今天,咱们就来聊聊...
朗逸安卓系统车载导航,安卓系统... 你有没有想过,开车的时候,导航系统就像是个贴心的导航小精灵,带你穿梭在城市的每一个角落?今天,就让我...
排球鹰眼系统辅助器安卓,安卓排... 你有没有想过,在观看排球比赛时,那些精准的鹰眼系统是如何让比赛画面更加清晰、精彩呢?现在,就让我带你...
安卓系统和magic的区别 你有没有发现,现在手机市场上安卓系统和Magic系统就像是一对双胞胎,长得有点像,但又各有各的特色。...
安卓系统模拟win7,轻松实现... 你有没有想过,在安卓手机上也能体验Windows 7的韵味呢?没错,这就是今天我要跟你分享的神奇之旅...
安卓系统查公交车 你有没有想过,在繁忙的都市生活中,如何轻松地查找到你心仪的公交车呢?别急,今天就来给你支个招——利用...
强悍的安卓10系统下载,强悍性... 你有没有听说最近安卓系统又升级啦?没错,就是那个强悍的安卓10系统!你是不是已经迫不及待想要体验一下...
安卓不开机怎么重置系统,轻松恢... 手机突然不开机了,是不是心里慌得一批?别急,今天就来教你一招,让你的安卓手机重置系统,恢复活力! 一...
安卓怎么移植到苹果系统,揭秘跨... 你是不是也和我一样,手里拿着安卓手机,却对那苹果系统的诱惑无法抗拒?想要把安卓上的宝贝应用和资料搬到...
安卓9系统特点在哪,系统革新与... 你有没有发现,你的安卓手机最近是不是变得有点不一样了?没错,就是那个默默无闻的安卓系统,它悄悄地升级...
苹果手机系统操作安卓版,轻松迁... 你有没有想过,为什么苹果手机的系统那么受欢迎,而安卓版却总是被大家调侃呢?今天,就让我带你从多个角度...
麦芽安装安卓系统怎么安装,轻松... 你有没有想过,把安卓系统装到麦芽上,是不是就像给老式收音机配上蓝牙功能那么酷炫呢?想象你的麦芽设备瞬...
直板安卓系统手机游戏,直板安卓... 你有没有发现,最近手机游戏界又掀起了一股热潮?没错,就是那些让你一玩就停不下来的直板安卓系统手机游戏...
nolia是安卓系统吗,安卓系... 你有没有听说过Nolia这个操作系统?最近它在科技圈里可是小火了一把呢!很多人都在问,Nolia是安...
改善后的安卓系统,探索安卓系统... 你知道吗?最近安卓系统可是来了一次大变身,简直就像是换了个新灵魂一样! 作为一个紧跟科技潮流的数码达...
安卓系统小票机如何使用,轻松实... 你有没有想过,在繁忙的超市、商场或者餐厅,那些快速打印出小票的机器竟然是运行在安卓系统上的呢?没错,...
rm1090刷安卓系统 你有没有想过,给手机换个新系统,就像给它换了个新灵魂?今天,就让我带你一起探索如何用rm1090刷安...
369出行安卓系统,智慧导航新... 你有没有发现,最近出行软件界又掀起了一股热潮?没错,就是那个备受瞩目的369出行安卓系统!今天,就让...
韩国请假系统下载安卓版,享受便... 你知道吗?最近有个超级实用的韩国请假系统在咱们安卓用户中传得沸沸扬扬的!这个系统不仅操作简单,而且功...