HTML表单标签

##  HTML标签:表单标签
    * 表单:
        * 概念:用于采集用户输入的数据的。用于和服务器进行交互。
        * form:用于定义表单的。可以定义一个范围,范围代表采集用户数据的范围
            * 属性:
                * action:指定提交数据的URL。
                * method:指定提交方式。
                    * 分类:一共7种,2种比较常用
                       * get:
                            1. 请求参数会在地址栏中显示。会封装到请求行中。
                            2. 请求参数大小是有限制的。
                            3. 不太安全。
                       * post:
                            2. 请求参数不会在地址栏中显示。会封装在请求体中。
                            2. 请求参数的大小没有限制。
                            3. 较为安全。

            * 表单项中的数据要想被提交:必须指定其name属性。

        
        * 表单项标签:
            * input:可以通过type属性值,改变元素展示的样式。
                * type属性:
                    * text:文本输入框,默认值
                        * placeholder:指定输入框的提示信息,当输入框的内容发生变化,会自动清空提示信息。   
                    * password:密码输入框
                    * radio:单选框
                        * 注意:
                            1. 要想让多个单选框实现单选的效果,则多个单选框的name属性值必须一样。
                            2. 一般会给每一个单选框提供value属性,指定其被选中后提交的值。
                            3. checked属性,可以指定默认值。
                    * checkbox:复选框
                        * 注意:
                            1. 一般会给每一个单选框提供value属性,指定其被选中后提交的值。
                            2. checked属性,可以指定默认值。

                    * file:文件选择框
                    * hidden:隐藏域,用于提交一些信息。
                    * 按钮:
                        * submit:提交按钮。可以提交表单
                        * button:普通按钮
                        * image:图片提交按钮
                            * src属性指定图片的路径    

               * label:指定输入项的文字描述信息
                   * 注意:
                       * label的for属性一般会和 input 的 id属性值 对应。如果对应了,则点击label区域,会让input输入框获取焦点。


            * select: 下拉列表
                * 子元素:option,指定列表项
                
            * textarea:文本域
                * cols:指定列数,每一行有多少个字符
                * rows:默认多少行。


##  HTML标签:表单标签示例

<form action="#" method="get"><!-- action="#" 代表提交到当前页面 --><label for="username"> 用户名 </label>:<input type="text" name="username" placeholder="请输入用户名" id="username"><br>密码:<input type="password" name="password" placeholder="请输入密码"><br>性别:<input type="radio" name="gender" value="male" >  男<input type="radio" name="gender" value="female" checked>  女<br>爱好:<input type="checkbox" name="hobby" value="shopping"> 逛街<input type="checkbox" name="hobby" value="java"  checked> Java<input type="checkbox" name="hobby" value="game"> 游戏<br>图片:<input type="file" name="file"><br>隐藏域:<input type="hidden" name="id" value="aaa"> <br>取色器:<input type="color" name="color"><br>生日:<input type="date" name="birthday"> <br>生日:<input type="datetime-local" name="birthday"> <br>邮箱:<input type="email" name="email"> <br>年龄:<input type="number" name="age"> <br>省份:<select name="province"><option value="">--请选择--</option><option value="1">北京</option><option value="2">上海</option><option value="3" selected>陕西</option></select><br>自我描述:<textarea cols="20" rows="5" name="des"></textarea><br><input type="submit" value="登录" ><input type="button" value="一个按钮" ><br><input type="image" src="img/regbtn.jpg"></form>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/133449.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

MySQL中的刷脏机制详解

名词解释 脏页&#xff1a;当内存数据页跟磁盘数据页内容不一致的时候&#xff0c;我们称这个内存页为“脏页”。 干净页&#xff1a;内存数据写入到磁盘后&#xff0c;内存和磁盘上的数据页的内容就一致了&#xff0c;称为“干净页”。 LSN&#xff1a;称为日志的逻辑序列号(l…

HTB——introduction to active directory

文章目录 一、Active directory structure二、Active Directory Terminology 一、Active directory structure Active Directory &#xff08;AD&#xff09; 是用于 Windows 网络环境的目录服务。它是一种分布式分层结构&#xff0c;允许集中管理组织的资源&#xff0c;包括用…

MIPI-CSI-2 RAW10笔记

好文&#xff1a; 【精选】摄像头的MIPI接口、DVP接口和CSI接口-CSDN博客【精选】摄像头的MIPI接口、DVP接口和CSI接口-CSDN博客 (56 封私信 / 24 条消息) 显示器的 VGA、HDMI、DVI 和 DisplayPort 接口有什么区别&#xff1f; - 知乎 (zhihu.com) 嵌入式工程师必备&#x…

基于白鲸算法的无人机航迹规划-附代码

基于白鲸算法的无人机航迹规划 文章目录 基于白鲸算法的无人机航迹规划1.白鲸搜索算法2.无人机飞行环境建模3.无人机航迹规划建模4.实验结果4.1地图创建4.2 航迹规划 5.参考文献6.Matlab代码 摘要&#xff1a;本文主要介绍利用白鲸算法来优化无人机航迹规划。 1.白鲸搜索算法 …

内核态内存映射

内核态的内存映射机制&#xff0c;主要包含以下几个部分&#xff1a; 内核态内存映射函数 vmalloc、kmap_atomic 是如何工作的&#xff1b;内核态页表是放在哪里的&#xff0c;如何工作的&#xff1f;swapper_pg_dir 是怎么回事&#xff1b;出现了内核态缺页异常应该怎么办&am…

什么是智慧工地?

智慧工地将更多人工智能、传感技术、虚拟现实等高科技技术植入到建筑、机械、人员穿戴设施、场地进出关口等各类物体中&#xff0c;并且被普遍互联&#xff0c;形成“物联网”&#xff0c;再与“互联网”整合在一起&#xff0c;实现工程管理干系人与工程施工现场的整合。智慧工…

OpenSSH

SSH&#xff08;Secure SHell protocol&#xff09;是一种在不安全网络上提供安全远程登录及其它安全网络服务的协议。SSH协议使用的是TCP 22号端口&#xff0c;telnet 使用的是TCP的23号端口&#xff0c;SSH协议是C/S架构&#xff0c;分为服务器端与客户端。 OpenSSH是对SSH协…

Vue使用epubjs电子书

npmjs: https://www.npmjs.com/package/epubjs 在线电子书转换器 安装&#xff1a; npm i epubjs 简单封装&#xff1a; src/hooks/ import Epub from "epubjs"; import type { Book, Rendition } from epubjs import type { BookOptions } from epubjs/types…

火山引擎云原生存储加速实践

在火山引擎相关的业务中绝大部分的机器学习和数据湖的算力都运行在云原生 K8s 平台上。云原生架构下存算分离和弹性伸缩的计算场景&#xff0c;极大的推动了存储加速这个领域的发展&#xff0c;目前业界也衍生出了多种存储加速服务。但是面对计算和客户场景的多样性&#xff0c…

CSS 滚动捕获 Scroll Snap

CSS 滚动捕获 Scroll Snap CSS 滚动捕获允许开发者通过声明一些位置(或叫作捕获位置)来创建精准控制的滚动体验. 通常来说轮播图就是这种体验的例子, 在轮播图中, 用户只能停在图 A 或者图 B, 而不能停在 A 和 B 的中间. 比如平时用淘宝或小红书, 当你上滑到下一个推荐内容时…

wpf Grid布局详解 `Auto` 和 `*` 是两种常见的设置方式 行或列占多个单元格,有点像excel里的合并单元格。使其余的列平均分配剩余的空间

比如只有行的界面 <Window x:Class"GenerateTokenApp.MainWindow"xmlns"http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x"http://schemas.microsoft.com/winfx/2006/xaml"xmlns:d"http://schemas.microsoft.com/exp…

YOLO目标检测——红绿灯检测数据集【含对应voc、coco和yolo三种格式标签】

实际项目应用&#xff1a;红绿灯检测数据集在自动驾驶、交通安全监控、智能交通系统、交通流量监测和驾驶员辅助系统等领域都有广泛应用的潜力数据集说明&#xff1a;红绿灯检测数据集&#xff0c;真实场景的高质量图片数据&#xff0c;数据场景丰富&#xff0c;含有国内红绿灯…

Zeus IoT : 基于 SpringBoot 的分布式开源物联网大数据平台

Zeus IoT 是一个集设备数据采集、存储、分析、观测为一体的开源物联网平台&#xff0c;全球首创基于 Zabbix 的物联网分布式数据采集架构&#xff0c;具备超百万级物联网设备的并发监控能力&#xff0c;真正具备工业级性能与稳定性的开源物联网大数据中台。 Zeus IoT 致力于让设…

快速实现一个企业级域名 SSL 证书有效期监控巡检系统

Why 现在对于企业来说&#xff0c;HTTPS 已经不是可选项&#xff0c;已经成为一个必选项。HTTPS 协议采用 SSL 协议&#xff0c;采用公开密钥的技术&#xff0c;提供了一套 TCP/IP 传输层数据加密的机制。SSL 证书是一种遵守 SSL 协议的服务器数字证书&#xff0c;一般是由权威…

Rust编程基础核心之所有权(下)

1.变量与数据交互方式之二: 克隆 在上一节中, 我们讨论了变量与数据交互的第一种方式: 移动, 本节将介绍第二种方式:克隆。 如果我们 确实 需要深度复制 String 中堆上的数据&#xff0c;而不仅仅是栈上的数据&#xff0c;可以使用一个叫做 clone 的通用函数。 看下面的代码…

Mac苹果电脑分辨率修改管理 安装SwitchResX 完美解决

SwitchResX for Mac是一款Mac应用程序&#xff0c;可帮助您更好地管理和控制显示器分辨率和其他显示设置。使用SwitchResX&#xff0c;您可以创建自定义分辨率、旋转屏幕、调整显示器色彩配置等。 1. 自定义分辨率&#xff1a;SwitchResX允许用户创建自定义的屏幕分辨率&#…

程序设计:C++ 多进程、多线程原理和一个多进程、多线程框架

并发编程和异步编程是程序员的基本技能&#xff0c;各种高级语言也开发出了一些高级但晦涩的机制&#xff08;比如C#的await/async&#xff09;。并发编程主要是指多进程、多线程和交替执行&#xff0c;异步编程则是指多个并发执行任务之间的交互。 目录 并发和异步的技术介绍…

VSCode设置中文语言界面(VScode设置其他语言界面)

一、下载中文插件 二、修改配置 1、使用快捷键 CtrlShiftP 显示出搜索框 2、然后输入 configure display language 3、点击 (中文简体) 需要修改的语言配置 三、重启 四、可能出现的问题 1、如果configure display language已经是中文配置&#xff0c;界面仍是英文 解决&a…

VinsFusion排坑指南

Ubuntu18.04Cere 下载1.14.0版本。Ceres安装方法参考vinsfusion的docker fileOpenCV相关报错 参考 https://wenda.ncnynl.com/article/5CV_LOAD_IMAGE_GRAYSCALE 改成 cv::IMREAD_GRAYSCALE 在三个CMakeLists文件中指定opencv的版本&#xff1a; find_package(OpenCV 3.2.0 REQ…

C++成长之路

看好的发展方向&#xff1a; 证券行业软件开发、AI自动化开发、桌面端工具类开发&#xff0c;云桌面技术 产品框架搭建 MFCDuilbLibcef Qt 技术深入 熟知编译器原理 C11/14等新知识的学习 泛型编程 / 模板编程 设计模式 多线程并发 多进程通讯 各种锁及其优缺点 必看书…