【HTML】HTML基础8.1(表单标签)

news2024/12/23 18:08:27

目录

效果

基础知识

标签

 代码


效果

基础知识

表单的组成元素
表单控件用户所填写的信息
提示信息提示用户需要填的信息
表单域包含表单元素的区域

 

标签

<form action="" method="">

</form>

<form>标签确定了一个表单域,我们的表单就是在这里面写的,其中

<form>标签的属性含义
action用户信息的存储地址
metho提交方式

等等

  • 这里我们只看基础部分,所以具体的地址和提交方式我们先不管

输入表单元素

<input type="" name="" value="">

 <input>标签的属性介绍

  • type=""
    text文本框
    hidden定义隐藏输入字段
    password密码框
    submit提交到服务器
    reset重置数据
    image图像形式的提交数据
    checkbox定义复选框(多选)
    radio定义单选框

name=""与value=""

两者都是给开发人员看的,不是所有的我们基础都要写的,不过在定义单选和复选时要给name赋同样的值,这样才能实现效果(理解:同一个名字表明是在同一个控件中做出选择)

 代码

与前面提到的标签一结合,就可以得到效果中所展示的啦~

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>虚假的影迷注册网站</title>
	</head>
	<body>
		<h1>虚假的影迷注册网站</h1>
		<form action="" method="">
			<h3>请选择您的性别</h3><br />
			男<input type="radio" name="sex" />		女<input type="radio" name="sex" />		沃尔玛塑料袋<input type="radio" name="sex" />
			<h3>定义您的昵称</h3>
			<input type="text" name="" id="" value="" />
			<h3>定义您的密码</h3>
			<input type="password" name="" id="" value="" />
			<h3>点击一张您最爱的照片,生成个性化页面</h3>
			<input type="image" src="./img/5人。2.jpg" width="100" />
			<input type="image" src="img/5人酷背景.jpg" width="200" />
			<input type="image" src="img/你好.jpg" width="150" />
			<h3>请选择您在银河护卫队中喜欢的角色(可多选)</h3><br />
			星爵<input type="checkbox" name="juese" id="" value="" />	火箭<input type="checkbox" name="juese" id="" value="" />	
			  毁灭者德拉克斯<input type="checkbox" name="juese" id="" value="" />	格鲁特<input type="checkbox" name="juese" id="" value="" />
			其他<input type="text"/>
			
		</form>
	</body>
</html>

今天的分享到这里结束啦~希望能帮到您!<・)))><<

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

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

相关文章

【Linux】第四十站:线程概念

文章目录 一、线程二、Linux中线程应该如何理解三、重新定义线程四、四谈进程地址空间&#xff08;页表相关&#xff09;五、Linux线程周边的概念1. 线程与进程切换2.线程优点3.线程缺点4.线程异常5.线程用途 一、线程 线程&#xff1a;是进程内的一个执行分支。线程的执行粒度…

阿里云DSW做AI绘画时的显卡选择A10?V100?

V100是Volta架构&#xff0c;A10是Ampere架构&#xff0c;架构上讲A10先进点&#xff0c;其实只是制程区别&#xff0c;用起来没区别。 V100是HBM的内存读取&#xff0c;带宽大&#xff0c;但是DDR5的。 二块卡都是全精度为主的算力卡&#xff0c;半精度优势不明显。 需要用…

Spring学习 基础(二)Bean和AOP

3、Spring Bean Bean 代指的就是那些被 IoC 容器所管理的对象&#xff0c;我们需要告诉 IoC 容器帮助我们管理哪些对象&#xff0c;这个是通过配置元数据来定义的。配置元数据可以是 XML 文件、注解或者 Java 配置类。 Bean的创建方式 1. XML 配置文件&#xff1a; 传统上&am…

Learn OpenGL 02 你好,三角形

图形渲染管线 图形渲染管线的每个阶段的抽象展示。要注意蓝色部分代表的是我们可以注入自定义的着色器的部分 首先&#xff0c;我们以数组的形式传递3个3D坐标作为图形渲染管线的输入&#xff0c;用来表示一个三角形&#xff0c;这个数组叫做顶点数据(Vertex Data)。 顶点着色…

最新2024年阿里云服务器地域和可用区全球分布表,不只是中国

2024年最新阿里云服务器地域分布表&#xff0c;地域指数据中心所在的地理区域&#xff0c;通常按照数据中心所在的城市划分&#xff0c;例如华北2&#xff08;北京&#xff09;地域表示数据中心所在的城市是北京。阿里云地域分为四部分即中国、亚太其他国家、欧洲与美洲和中东&…

superset连接Apache Spark SQL(hive)过程中的各种报错解决

superset连接数据库官方文档&#xff1a;Installing Database Drivers | Superset 我们用的是Apache Spark SQL&#xff0c;所以首先需要安装下pyhive #命令既下载了pyhive也下载了它所依赖的其他安装包 pip install pyhive#多个命令也可下载 pip install sasl pip install th…

设计模式-结构型模式-代理模式

代理模式&#xff08;Proxy&#xff09;&#xff0c;为其他对象提供一种代理以控制对这个对象的访问。[DP] // 定义接口 interface Subject {void request(); }// 真实主题对象 class RealSubject implements Subject {Overridepublic void request() {System.out.println(&quo…

App自动化测试笔记(十一):综合案例

短信案例 需求 在《短信》应用中&#xff0c;进入发送短信页面&#xff0c;在姓名和内容栏中&#xff0c;输入对应的数据&#xff0c;并点击发送。 包名界面名&#xff1a;com.android.mms/.ui.ConversationList 发送短信页面标识&#xff1a;resource-id&#xff0c;com.and…

乐得瑞 1C to 2C快充线:引领充电数据线新潮流,高效快充解决接口难题

随着科技的不断进步&#xff0c;数据线的接口种类也日渐繁多&#xff0c;但在早些时候&#xff0c;三合一和二合一的数据线因其独特的设计而备受欢迎。这类数据线通常采用USB-A口作为输入端&#xff0c;并集成了Micro USB、Lightning以及USB-C三种接口&#xff0c;满足了当时市…

【二】【算法分析与设计】编程练习

数字三角形 链接&#xff1a;登录—专业IT笔试面试备考平台_牛客网 来源&#xff1a;牛客网 时间限制&#xff1a;C/C 1秒&#xff0c;其他语言2秒 空间限制&#xff1a;C/C 32768K&#xff0c;其他语言65536K 64bit IO Format: %lld 题目描述 KiKi学习了循环&#xff0c;BoBo…

2024年AI辅助研发趋势深度分析

随着人工智能&#xff08;AI&#xff09;技术的飞速发展&#xff0c;其在各个行业领域中的应用也日益广泛。特别是在研发领域&#xff0c;AI已经成为变革的先锋&#xff0c;极大地推动了科技进步的步伐。本文将从技术进展、行业应用案例、面临的挑战与机遇、未来趋势预测、法规…

JavaScript实现小球移动(二)

这次采用了封装函数的方法&#xff0c;将小球向左向右移动封装在同一个函数内。 代码&#xff1a; <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-wi…

接雨水(leetcode hot100)

给定 n 个非负整数表示每个宽度为 1 的柱子的高度图&#xff0c;计算按此排列的柱子&#xff0c;下雨之后能接多少雨水。 示例 1&#xff1a; 输入&#xff1a;height [0,1,0,2,1,0,1,3,2,1,2,1] 输出&#xff1a;6 解释&#xff1a;上面是由数组 [0,1,0,2,1,0,1,3,2,1,2,1] …

‘ jupyter ‘ 不是内部或外部命令,也不是可运行的程序或批处理文件。

安装anaconda后&#xff0c;在 Dos黑窗口 运行 jupyter notebook 的两个问题 原因&#xff1a;没配置环境变量 解决方法&#xff1a; 在 系统环境变量Path 中 添加两个地址 这里以anaconda安装在 D:\anaconda\install 下为例 &#xff08;根据个人安装具体位置而定&#xff…

Centos7.9安装glibc2.18后回滚到glibc2.17

对glibc的操作非常危险&#xff0c;如果您对Linux操作系统的操作仅限于查看别人的资料来解决问题的话&#xff0c;我还是比较真诚的劝退你了。只所以还是写下这篇博文&#xff0c;一是为了记录自己排错的过程&#xff0c;二是更正目前网络中一些不太正确的博文&#xff0c;防止…

史上最全AP/mAP通用代码实现(yolov5 txt版本)-下

提示&#xff1a;通用map指标框架代码介绍&#xff0c;直接使用yolov5数据格式&#xff0c;实现论文map指标计算代码解读 文章目录 前言该版本是直接使用yolo数据格式实现map计算&#xff0c;集成txt转json格式内容。 一、map模块整体认识二、map计算应用代码解读三、通用map计…

指针进阶(4)看一下这些与指针有关的题你都会做吗?

c语言中的小小白-CSDN博客c语言中的小小白关注算法,c,c语言,贪心算法,链表,mysql,动态规划,后端,线性回归,数据结构,排序算法领域.https://blog.csdn.net/bhbcdxb123?spm1001.2014.3001.5343 给大家分享一句我很喜欢我话&#xff1a; 知不足而奋进&#xff0c;望远山而前行&am…

JVM-垃圾收集器G1

G1垃圾回收器 概述&#xff1a; 是一款面向服务器的垃圾收集器,主要针对配备多个处理器及大容量内存的机器. 以极高效率满足GC停顿时间要求的同时,还具备高吞吐量性能特征.G1保留了年轻代和老年代的概念&#xff0c;但不再是物理隔阂了&#xff0c;它们都是&#xff08;可以不连…

供应链管理系统(SCM):得供应链得天下不是空话。

2023-08-26 15:51贝格前端工场 Hi&#xff0c;我是贝格前端工场&#xff0c;优化升级各类管理系统的界面和体验&#xff0c;是我们核心业务之一&#xff0c;欢迎老铁们评论点赞互动&#xff0c;有需求可以私信我们 一、供应链对于企业的重要性 供应链对企业经营的重要性不可…

在外包公司搞了2年,出来技术都没了...

先说情况&#xff0c;大专毕业&#xff0c;18年通过校招进入湖南某软件公司&#xff0c;干了接近6年的功能测试&#xff0c;今年年初&#xff0c;感觉自己不能够在这样下去了&#xff0c;长时间呆在一个舒适的环境会让一个人堕落&#xff01;而我已经在一个企业干了2年的的功能…