表单元素练习
来源：互联网 发布：全民公主神兵数据图 编辑：程序博客网 时间：2024/05/20 00:10
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>表单</title>
</head>
<body>
<form action="xxx.asp" method="get">
<fieldset>
<legend>学生基本信息</legend>
姓名：<input type="text" name="txtNam" maxlength="10" placeholder="君の名"/><br/>
密码：<input type="password" name="txtPwd" placeholder="君の秘" /><br/>
性别：<input type="radio" name="rdoSex" value="Male" id="raoM" checked/>
<label for="rdoM">男♂</label>
<input type="radio" name="rdoSex" value="Female" id="rdoF"/>
<label for="rdoF">女♀</label><br/>
爱好：<input type="checkbox" name="chbHobby" value="play" id="Hplay" />
<label for="Hplay">玩</label><br/>
<input type="checkbox" name="chbHobby" value="eat" id="Heat"/>
<label for="Heat">吃</label><br/>
<input type="checkbox" name="chbHobby" value="code" is="Hcode"/>
<label for="Hcode">敲代码</label><br/>
隐藏域：<input type="hidden" name="hid" value="#"><br/>
<p>文件选择框：<input type="file" name="txtFile"></p>
籍贯地址：<select size="2">
<option>山东</option>
<option>黑龙江</option>
<option>北京</option>
</select><br/>
就业倾向城市：<select size="5" multiple>
<option>北京</option>
<option>天津</option>
<option>上海</option>
<option>重庆</option>
</select><br/>
自我介绍：<br/>
<textarea cols="20" rows="8">
</textarea><br/>
电子邮件：<input type="email" placeholder="name@xx.com"/><br/>
搜索：<input type="search" name="txtSch" placeholder="搜索"/><br/>
url:<input type="url" /><br/>
电话号码：<input type="tel" /><br/>
年龄（数字）：<input type="number" min="0" max="70"><br/>
择偶年龄（范围）：18<input type="range" min="18" max="70">70<br/>
喜好颜色：<input type="color"/><br/>
出生日期：<input type="date"/><br/>
星期：<input type="week"/><br/>
月份：<input type="month"/><br/>
重置：<input type="reset" value="重新填写"/><br/>
提交：<input type="submit" value="确认提交"/><br/>
自定义按钮：<input type="button" value="按下会有不可思议的“惊喜”"/><br/>
图片按钮:<input type="image" src="C:\Users\Admin\Desktop\冲田总司\60350538_p0.jpg" width="100px">
</fieldset>
</form>
</body>
<html>
<head>
<meta charset="UTF-8">
<title>表单</title>
</head>
<body>
<form action="xxx.asp" method="get">
<fieldset>
<legend>学生基本信息</legend>
姓名：<input type="text" name="txtNam" maxlength="10" placeholder="君の名"/><br/>
密码：<input type="password" name="txtPwd" placeholder="君の秘" /><br/>
性别：<input type="radio" name="rdoSex" value="Male" id="raoM" checked/>
<label for="rdoM">男♂</label>
<input type="radio" name="rdoSex" value="Female" id="rdoF"/>
<label for="rdoF">女♀</label><br/>
爱好：<input type="checkbox" name="chbHobby" value="play" id="Hplay" />
<label for="Hplay">玩</label><br/>
<input type="checkbox" name="chbHobby" value="eat" id="Heat"/>
<label for="Heat">吃</label><br/>
<input type="checkbox" name="chbHobby" value="code" is="Hcode"/>
<label for="Hcode">敲代码</label><br/>
隐藏域：<input type="hidden" name="hid" value="#"><br/>
<p>文件选择框：<input type="file" name="txtFile"></p>
籍贯地址：<select size="2">
<option>山东</option>
<option>黑龙江</option>
<option>北京</option>
</select><br/>
就业倾向城市：<select size="5" multiple>
<option>北京</option>
<option>天津</option>
<option>上海</option>
<option>重庆</option>
</select><br/>
自我介绍：<br/>
<textarea cols="20" rows="8">
</textarea><br/>
电子邮件：<input type="email" placeholder="name@xx.com"/><br/>
搜索：<input type="search" name="txtSch" placeholder="搜索"/><br/>
url:<input type="url" /><br/>
电话号码：<input type="tel" /><br/>
年龄（数字）：<input type="number" min="0" max="70"><br/>
择偶年龄（范围）：18<input type="range" min="18" max="70">70<br/>
喜好颜色：<input type="color"/><br/>
出生日期：<input type="date"/><br/>
星期：<input type="week"/><br/>
月份：<input type="month"/><br/>
重置：<input type="reset" value="重新填写"/><br/>
提交：<input type="submit" value="确认提交"/><br/>
自定义按钮：<input type="button" value="按下会有不可思议的“惊喜”"/><br/>
图片按钮:<input type="image" src="C:\Users\Admin\Desktop\冲田总司\60350538_p0.jpg" width="100px">
</fieldset>
</form>
</body>
</html>
附完成图
阅读全文
1 0
- 表单元素练习一
- 表单元素练习二
- 表单元素练习
- 对于HTML5表单新增元素的小练习
- 表单练习
- 表单练习
- 表单元素
- 表单元素
- 表单元素
- 表单元素
- 表单元素
- javascript 表单和表单元素
- HTML5表单_表单元素
- Html表单和表单元素
- 选取表单和表单元素
- 表单练习二
- 超链接，表单练习
- struts练习-表单提交
- JS 设计模式--接口实现
- JavaWeb（七）Cookie，EL表达式，标准标签库
- 周中训练笔记+广西邀请赛1001（8.31）
- Spark 名词解释
- FEC详解一
- 表单元素练习
- 2017年8月31日训练总结
- Spring源码阅读（五）—AOP基础
- layui中弹出一个弹框，通过内嵌页面里的操作关掉整个弹出层窗口
- HDU6191(dfs序 + 可持久Trie树)
- Hadoop2.2.0伪分布式搭建
- Java线程中使用 sleep()和wait()区别
- 鼠标左键控制玩家移动
- FEC详解二
