<form>表单

article/2025/9/22 0:08:28

 

1.form表单

<form>标签是表单是一个框架,其中主要包含<input>,<textarea>,<select>标签

 

1.1<input>标签

<input>标签首先是一个单标签

<input>标签的格式是<input type="" value="" name="" >(如下图)

<input type="text" name="userName">

1.1.1

type用来设置 <input>标签的格式

type="text"-------------单行文本框

type="password"---------用于密码的输入(密码会被掩饰,看不到)

type="submit"-------------提交按钮

type="radio"---------单选按钮

type="checkbox" -----------多选按钮

type="button"--------普通的按钮(可赋予一些功能)

type="reset"----------复位按钮(相当于刷新页面,原本选择或写入的东西全部需要重新输入)

type="image"----------图像按钮(使用一张图片作为按钮,需注意图片的大小,慎用)

type="hidden"---------隐藏域(慎用)

type="file"----------文本域

type="email"-----需输入邮箱时使用

type="color"--------颜色

type="date"--------精确到今天的年月日

type="datetime-local'--------------精确到今天的几点几分

type="time" ---------显示当前的时间

type="number"--------------显示数字,并可以规定数字的取值范围。如<input type="number" max="10"  min="1">,表示数字范围从1到10

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Document</title>
</head>
<body><form>请输入用户名:<input type="text" name="userName"><br>密码:<input type="password" name="password"> <br><input type="submit" value="提交"><br><input type="radio" value="普通按钮">普通按钮<br><input type="checkbox" name="like">写作<input type="checkbox" name="like">体育<input type="checkbox" name="like">听音乐<input type="button"><br><input type="reset" name="复位"><br><input type="image" src="./1.jpg"><br><input type="file" name="文本域"><br>请输入邮箱<input type="email"><br><input type="color" ><br><input type="date"><input type="datetime"><input type="datetime-local"><br>请输入数字<input type="number" max="10" min="1"></form>
</body>
</html>

 

 

1.1.2

在<input>标签中,下列元素的具体用法如下

name------- 代表 元素的名称
value ----- 代表 元素的值
id -------- 表示 元素的唯一标识符
size -------- 以字符的个数设定元素的宽度
maxlength --------- 元素接受字符个数的上限
checked -------- 代表默认选中
readonly ---------- 表示 输入的字段仅仅是只读,不能做任何修改
disabled ------ 禁用 input 元素 ,表示该元素被固定, 不可用,也不可以点击
required------- 提交信息的时候,input不能为空 ,如果为空会有相关的提示
autofocus --------打开页面时,自动获取光标
placeholder-------元素显示在文本框中,不影响输入,一般用来提示输入的内容的要求或提示

1.1.3

select标签

<select>标签和<option>标签一起使用,设置下拉选择框

selected表示默认选择的元素

			<select ><option value="北京">北京</option><option value="上海">上海</option><option value="陕西" selected>陕西</option><option value="四川">四川</option><option value="重庆">重庆</option><option value="河北">河北</option></select>

1.1.4

<textarea>标签

该标签表示多行文本框,

cols----用字符个数限制多行文本框的宽度

rows----用字符个数限制多行文本框的高度

<textarea name="intro" cols="25" rows="5" placeholder="这家伙很懒什么也没留下!"></textarea>

 

 


http://chatgpt.dhexx.cn/article/Gi3YnXaU.shtml

相关文章

表单<form>

创建表单 <form> 标签用于创建供用户输入的 HTML 表单。 <form>标签的action属性的值指定了表单提交到服务器的地址。 <form> 元素包含一个或多个如下的表单元素&#xff1a; <input> <textarea> <button> <select> <option&g…

ASP.NET WebForm--简介

文章目录 ASP.NETASP.NET 模型HTTP请求处理过程HttpHandler ASP.NET ASP.NET基于.NET Framework的Web开发平台&#xff0c;不但吸收了ASP以前版本的最大优点并参照Java、VB语言的开发优势加入了许多新的特色&#xff0c;同时也修正了以前的ASP版本的运行错误。 ASP.NET就是属于…

WebForm

什么是ASP.NET ASP.NET指的是动态服务器页面(Active Server Pages),运行在IIS&#xff08;Internet Information Service)上&#xff0c;文件类似于HTML,后缀为.aspx. Classic ASP的局限性&#xff1a; 代码块必须放置在需要进行输出的位置 <html> <body style&qu…

ASP.NET(一)--WebForm简单介绍

WebForm B/S程序 浏览器服务应用程序&#xff0c;直接可以解释为网站类应用程序 静态网页与服务器技术 静态网页 以.html或以.htm为后缀的网页文件只能单纯的显示文本和图像无法和用户进行数据交互&#xff0c;无法根据用户的请求显示不同的网页内容(也就是无法和后台数据库…

关于webform的简单的基础操作 2.学会开发(一)

.net的B/S架构开发主要是MVC和webform的开发&#xff0c;因为WebForm是微软开发的一款产品&#xff0c;它将用户的请求和响应都封装为控件。让开发者认为自己是在操作一个windows界面&#xff08;和winform也是差不多的&#xff09;。极大地提高了开发效率。而MVC是由视图&…

35.Trie树:如何实现搜索引擎的搜索关键词提示功能

文章目录 1. 什么是“Trie树”&#xff1f;2. 如何实现一棵Trie树&#xff1f;3.Trie树真的很耗内存吗&#xff1f;4.Trie树与散列表、红黑树的比较5. 解答开篇 问题&#xff1a;搜索引擎的关键词的联想词是如何实现的&#xff1f; 1. 什么是“Trie树”&#xff1f; Trie树&a…

Trie树详解

什么是Trie树 Trie树又称字典树、单词查找树。是一种能够高效存储和查找字符串集合的数据结构。 可以快速的在集合中查询某个字符串 Trie树的本质就是利用字符串之间的公共前缀&#xff0c;将重复的前缀合并在一起 Trie的存储 Trie的存储形式就是构造成一个树形结构 比如我们以…

java trie_Trie树(字典树)的介绍及Java实现

简介 Trie树&#xff0c;又称为前缀树或字典树&#xff0c;是一种有序树&#xff0c;用于保存关联数组&#xff0c;其中的键通常是字符串。与二叉查找树不同&#xff0c;键不是直接保存在节点中&#xff0c;而是由节点在树中的位置决定。一个节点的所有子孙都有相同的前缀&…

Trie前缀树

Trie前缀树 简介 Trie (发音为 "try") 又经常叫前缀树&#xff0c;字典树等等&#xff0c;是一种树数据结构&#xff0c;用于检索字符串数据集中的键。 在计算机科学中&#xff0c;trie是一种有序树&#xff0c;用于保存关联数组&#xff0c;其中的键通常是字符串…

Trie树

Trie树 文章目录 Trie树Trie树介绍应用场景举例代码实现例题 Trie树介绍 字典树 又称单词查找树&#xff0c;Trie树&#xff0c;是一种树形结构&#xff0c;是一种哈希树的变种。典型应用是用于统计&#xff0c;排序和保存大量的字符串&#xff08;但不仅限于字符串&#xff…

trie 树

一、普通 t r i e \rm trie trie 树 t r i e \rm trie trie 树又称字典树、前缀树&#xff0c;它把很多单词放到一棵树上&#xff0c;使用空间去换时间。 LUOGU2580 于是他错误的点名开始了 Description \text{Description} Description 给定 n n n 个互不相同且只含小写字…

Trie

文章目录 应用替换其他数据结构字典表达术语索引 算法排序全文检索 实现Bitwise triesCompressing triesExternal memory trie About Me Trie ,也叫做 digital tree(数字树) 有时候也是 radix tree(基数树) 或者 prefix tree(前缀树) (因为他们可以通过前缀进行搜索) 是一种 se…

Trie(字典树/前缀树)

字典树/前缀树 Trie&#xff08;发音类似 “try”&#xff09;或者说 前缀树&#xff08;字典树&#xff09; 是一种树形数据结构&#xff0c;用于高效地存储和检索字符串数据集中的键。这一数据结构有相当多的应用情景&#xff0c;例如自动补完和拼写检查。主要思想是利用字符…

trie(字典树、前缀树)

trie&#xff08;字典树、前缀树&#xff09; 1. trie原理 原理 trie树&#xff0c;又被称为字典树、前缀树&#xff0c;是一种高效地存储和查找字符串集合的数据结构。一般来说&#xff0c;用到trie的题目中的字母要么全是小写字母&#xff0c;要么全是大写字母&#xff0c;要…

Trie详解

Trie&#xff0c;又名字典树、单词查找树&#xff0c;可以较高效地实现统计、排序和保存大量的字符串。 顾名思义&#xff0c;Trie是一个树状的结构&#xff0c;按照树型结构来存储字符串&#xff0c;显然是一种以空间换时间的方法。整体上理解和实现都不会很难。 下面是实现方…

Trie 简介

一、Trie简介 在计算机科学中&#xff0c;Trie&#xff0c;又称字典树、前缀树、单词查找树或键树&#xff0c;是一种树形结构&#xff0c;是一种哈希树的变种。典型应用是用于统计&#xff0c;排序和保存大量的字符串&#xff08;但不仅限于字符串&#xff09;&#xff0c;所以…

Trie 字典树 详解

&#x1f60a; | Powered By HeartFireY | Tire Algorithm 一、字典树 1.字典树简介 字典树&#xff0c;英文名Trie&#xff0c;如其名&#xff1a;就是一棵像字典一样的树。 我们首先通过一张图来理解字典树的结构&#xff1a; 我们假定结点的顺序按照图中给定的顺序进行编…

Web前端面试题汇总(持续更新...)

H5 的新特性有哪些&#xff1f;C3 的新特性有哪些&#xff1f; H5 新特性 拖拽释放(Drap and drop) API ondrop自定义属性 data-id语义化更好的内容标签(header,nav,footer ,aside, article, section)音频 ,视频(audio, video) 如果浏览器不支持自动播放怎么办?在属性中添加…

Web前端面试题(全锦集)

1 第一部分&#xff1a; 聪明的猴子都在看右下角目录 点击查看更多资源 前端基础(HTML CSS JS基础) 1. 怎么让一个不定宽高的 DIV&#xff0c;垂直水平居中&#xff1f; 答&#xff1a;1.使用 CSS 方法&#xff1a; 父盒子设置&#xff1a;display&#xff1a;table…

web前端开发面试题(一)

一、html部分 1.1 link和import 区别如下&#xff1a; 1.1.1从属关系区别 import是 CSS 提供的语法规则&#xff0c;只有导入样式表的作用&#xff1b;link是HTML提供的标签&#xff0c;不仅可以加载 CSS 文件&#xff0c;还可以定义 RSS、rel 连接属性等。 2.加载顺序区别…