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）属性

①

在这里插入图片描述

②


网页标题
个人简介

在这里插入图片描述

词库加载错误:未能找到文件“E:\highferrum_mysql\Configuration\Dict_Stopwords.txt”。

上一篇：用Python优雅地求解阿基米德分牛问题

下一篇：MySQL事务篇

相关内容

热门资讯

122.（leaflet篇）l... 听老人家说：多看美女会长寿 地图之家总目录（订阅之前建议先查看该博客） 文章末尾处提供保证可运行...
育碧GDC2018程序化大世界... 1.传统手动绘制森林的问题 采用手动绘制的方法的话，每次迭代地形都要手动再绘制森林。这...
育碧GDC2018程序化大世界... 1.传统手动绘制森林的问题 采用手动绘制的方法的话，每次迭代地形都要手动再绘制森林。这...
Vue使用pdf-lib为文件... 之前也写过两篇预览pdf的，但是没有加水印，这是链接：Vu...
PyQt5数据库开发1 4.1... 文章目录 前言 步骤/方法 1 使用windows身份登录 2 启用混合登录模式 3 允许远程连接服...
Android studio ... 解决 Android studio 出现“The emulator process for AVD ...
Linux基础命令大全（上） ♥️作者：小刘在C站 ♥️个人主页：小刘主页 ♥️每天分享云计算网络运维...
再谈解决“因为文件包含病毒或潜... 前面出了一篇博文专门来解决“因为文件包含病毒或潜在的垃圾软件”的问题，其中第二种方法有...
南京邮电大学通达学院2023c... 题目展示 一.问题描述 实验题目1 定义一个学生类，其中包括如下内容： （1）私有数据成员 ①年龄 ...
PageObject 六大原则 PageObject六大原则： 1.封装服务的方法 2.不要暴露页面的细节 3.通过r...
【Linux网络编程】01：S... Socket多进程 OVERVIEWSocket多进程1.Server2.Client3.bug&...
数据结构刷题（二十五）：122... 1.122. 买卖股票的最佳时机 II思路：贪心。把利润分解为每天为单位的维度,然后收...
浏览器事件循环 事件循环 浏览器的进程模型 何为进程？ 程序运行需要有它自己专属的内存空间࿰...
8个免费图片/照片压缩工具帮您... 继续查看一些最好的图像压缩工具，以提升用户体验和存储空间以及网站使用支持。 无数图像压...
计算机二级Python备考（2... 目录  一、选择题 1.在Python语言中： 2.知识点 二、基本操作题 1. j...
端电压 相电压 线电压 记得刚接触矢量控制的时候，拿到板子，就赶紧去测各种波形，结...
如何使用Python检测和识别... 车牌检测与识别技术用途广泛，可以用于道路系统、无票停车场、车辆门禁等。这项技术结合了计...
带环链表详解 目录 一、什么是环形链表 二、判断是否为环形链表 2.1 具体题目 2.2 具体思路 2.3 思路的...
【C语言进阶：刨根究底字符串函... 本节重点内容： 深入理解strcpy函数的使用学会strcpy函数的模拟实现⚡strc...
Django web开发(一)... 文章目录前端开发1.快速开发网站2.标签2.1 编码2.2 title2.3 标题2.4 div和s...