HTML16:搜索框滑块和简单验证
代码show
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>10.表单</title>
</head>
<body>
<h1>注册</h1>
<!--
action: 表单提交的位置,可以是网站,也可以是一个请求处理地址
method:post,get提交方式
get方式提交:我们可以在url中看到我们提交的信息,不安全,高效
post:比较安全,传输大文件
-->
<form action="我的第一个HTML.html" method="get">
<!-- 文本输入框:input type="text"
value= "工一" 默认初始值
maxlength="10" 最长能写几个字符
size="30" 文本框的长度
-->
<p>名字:<input type="text" name="username" value= "工一" maxlength="10" size="30"/></p>
<!-- 密码框: input type="password" -->
<p>密码:<input type="password" name="pwd"/></p>
<p>性别:
<!--单选框标签
input type="radio"
value="boy" 单选框的值
name="sex" 表示组
-->
<input type="radio" value="boy" name="sex" checked/>男
<input type="radio" value="girl" name="sex" />女
</p>
<!-- 多选框
input type="checkbox"
-->
<p> 爱好:
<input type="checkbox" name="hobby" value="sleep">睡觉
<input type="checkbox" name="hobby" value="sleep" checked>敲代码
<input type="checkbox" name="hobby" value="sleep">聊天
<input type="checkbox" name="hobby" value="sleep">跑步
</p>
<p>按钮
<input type="button" name="btn1" value="我是按钮">
<!-- <input type="image" src="../resources/image/哔哩哔哩.jpg">-->
</p>
<p>
<!-- 下拉框,列表框-->
国家:
<select name="列表名称">
<option value="China">中国</option>
<option value="USA">美国</option>
<option value="Japan" selected>日本</option>
<option value="India">印度</option>
</select>
</p>
<p>
<!-- 文本域
cols="50" rows="10"
-->
反馈:
<textarea name="textarea" cols="50" rows="10">请输入反馈意见</textarea>
</p>
<p>
文件:
<!-- 文件域名
input type="file" name="files"
-->
<input type="file" name="files">
<input type="button" name="upload" value="上传"/>
</p>
<p>邮箱:
<!-- 邮件验证-->
<input type="email" name="email"/>
</p>
<p>url:
<!-- url验证-->
<input type="url" name="url"/>
</p>
<p>商品数量:
<!-- 数字验证-->
<input type="number" name="num" max="100" min="10" step="10"/>
</p>
<p>音量:
<!-- 滑块:
input type="range"
-->
<input type="range" name="voice" max="100" min="10" step="10"/>
</p>
<p>搜索:
<!-- 搜索框-->
<input type="search" name="search"/>
</p>
<p><input type="submit"/><input type="reset" value="清空表单"></p>
</form>
</body>
</html>