<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>登录注册</title>
</head>
<body>
<h1>注册</h1>
<!--表单form-->
<!--action：表单提交的位置，可是网站或请求处理的地址
method：post:比较安全，可以传输大文件、get：可以在url中看到我们提交的信息，不安全但高效
value：默认值 maxlength：最长可写几个字符 size：文本框长度-->
<!--表单验证-->
<!--placeholder：提示信息；required:非空判断 pattern：正则表达式-->
<form action="1、我的第一个网页.html"method="get">
<!--文本输入框<input type="text"
readonly:只读
hidden:隐藏
disable：禁用-->
<p>
名字：<input type="text" name="username" placeholder="请输入用户名" required>
</p>
<p>
密码：<input type="password" name="user_password" value="123456">
</p>
<!--单选框
checked：默认选项-->
<p>性别：
<input type="radio" value="boy" name="sex" checked>男
<input type="radio" value="girl" name="sex">女
</p>
<!-- 多选框-->
<p>爱好：
<input type="checkbox" value="sleep" name="hobby">睡觉
<input type="checkbox" value="code" name="hobby">编程
<input type="checkbox" value="chat" name="hobby">聊天
<input type="checkbox" value="game" name="hobby">游戏
</p>
<!-- 按钮-->
<!--
input type="button"：普通按钮
input type="image"：图像按钮
input type="reset"：重置按钮
type="submit":提交按钮-->
<p>按钮：
<input type="button" name="btn1" value="点击">
<!-- <input type="image" src="../HTML/resources/images/c.jpeg">-->
</p>
<!-- 下拉框select-->
<p>国籍：
<select name="国家" id="001">
<option value="China" selected>中国</option>
<option value="Japan">日本</option>
<option value="England">英国</option>
<option value="US">美国</option>
</select>
<select name="省份" id="002">
<option value="广东">广东</option>
<option value="广西">广西</option>
<option value="江西">江西</option>
</select>
</p>
<!-- 文本域textarea -->
<!-- 列： cols="50" 行：rows="10"-->
<p>反馈：
<textarea name="textarea" cols="50" rows="10">请输入文本</textarea>
</p>
<!--文件域-->
<p>
<input type="file" name="files">
<input type="button" name="upload" value="上传">
</p>
<!-- 邮件验证 -->
<p>邮箱：
<input type="email" name="email" id="mark">
</p>
<p>自定义邮箱：
<input type="text" name="diyemail" pattern="w+([-+.]w+)*@w+([-.]w+)*.w+([-.]w+)*">
</p>
<p>URL：
<input type="url" name="url">
</p>
<!-- 数字框 -->
<p>商品数量：
<input type="number" name="number" min="0" max="100" step="1">
</p>
<!-- 滑块-->
<p>音量：
<input type="range" name="voice" min="0" max="100" step="2">
</p>搜索关键字：
<!--搜索框-->
<input type="search" name="search">
<!-- 增强鼠标可用性-->
<p>
<label for="mark">点点试试</label>
</p>
<p>
<input type="reset" value="重填">
<input type="submit"value="提交">
</p>
</form>
</body>
</html>
浙公网安备 33010602011771号