【HTML】HTML表单8.2(表单标签2)

目录

接上期,大致实现效果

文章简要

注释:这一次介绍的很多效果需要后期与服务器配合,但我们这里先只介绍效果

①提交按钮

②获取验证码

③上传文件

④还原所有表单内容

⑤下拉表单

⑥文字域


接上期,大致实现效果

文章简要

注释:这一次介绍的很多效果需要后期与服务器配合,但我们这里先只介绍效果

①提交按钮

②获取验证码

③上传文件

④还原所有表单内容

⑤下拉表单

⑥文字域

①提交按钮

html 复制代码
<input type="submit"/>

》》这里一般是会传给服务器,但这里我们先不讨论

效果

②获取验证码

html 复制代码
<input type="button" value="提交验证码" />

效果

》》这里一般是后期与js搭配使用,但这里我们先不讨论

③上传文件

html 复制代码
<input type="file"/>

效果

》》这里一般是会传给服务器,但这里我们先不讨论

④还原所有表单内容

html 复制代码
<input type="reset" value="点我全部恢复" />

效果

这个不用结合服务器,是真的可以全部恢复

⑤下拉表单

html 复制代码
年<select>
					<option>2005</option>
					<option>2004</option>
					<option>2003</option>
					<option>2002</option>
					<option>2001</option>
					<option>2000</option>
				</select>
				月<select>
					<option>1</option>
					<option>2</option>
					<option>3</option>
					<option>4</option>
					<option>5</option>
					<option>6</option>
					<option>7</option>
					<option>8</option>
					<option>9</option>
					<option>10</option>
					<option>11</option>
					<option>12</option>
				</select>

这个需要搞一些介绍了

<select></select>双标签中的<option></option>中包含的就是下拉时所展示的元素们

效果

⑥文字域

html 复制代码
<textarea rows="5" cols="50">
				说吧孩子
			</textarea><

介绍(不常用):

rows表示行数,cols表示列数

行数不够了会自动加

<textarea>中的内容是文字区域中一开始就会有的内容

效果

今天的分享就结束啦~希望对您有帮助!!

相关推荐
风月说与山鬼1 小时前
三、大括号语法
前端·react.js
kyriewen1 小时前
我把最常踩的8个CORS跨域报错整理了一遍——第8个去年还不存在
前端·javascript
Csvn2 小时前
🕰️ 闭包 + setTimeout 的 5 个经典陷阱:为什么定时器看到的永远不是最新的值?
前端
lilian2332 小时前
Harmony os 技术实战|拼豆制图27:用单字符编码承载 50 张 70×70 图纸
前端·数据库·华为·harmonyos
CarIise3 小时前
CSS选择器与样式关联
前端·css·tensorflow
里欧跑得慢4 小时前
CSS 模块化架构的演进:BEM、CSS Modules 到 CSS-in-JS 的反思
前端·css·flutter·web·css-in-js
IT_陈寒4 小时前
Vue的computed属性把我坑惨了,原来我一直用错姿势
前端·人工智能·后端
小灰灰搞电子5 小时前
Rust+Slint 实现温度计源码分享
前端·rust·slint
计算机魔术师5 小时前
面壁智能 OpenBMB 推出 MathForm,面向 Lean 4 数学自动形式化的开源框架、数据集与模型
前端