13.文本框和单选框
文本款必写: <input type="radio" value="box" name="sex"/>
单选框标签 type: value: 值 name: 组名 <p>性别: 男<input type="radio" value="box" name="sex"/> 女<input type="radio" value="girl" name="sex"/> </p>
14.按钮和多选框
必写: 1.多选框 type value name 2.单选框标签 type: value: 值 name: 组名 3.按钮: type value name 4.图片按钮 (具有提交地功能) type src
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>表单</title> </head> <body> <!-- <form> action :表单提交地位置,可以是网站,也可以是一个请求处理地位 method : post|get 提交方式 get方式提交: 我们可以再url中,看到我们提交地信息,不安全,能够看到账号和密码 pos方式提交: 我们看不到密码和账号,比较安全。 ` 2.<input> type : 文本框类型 name : 组名 value : 默认值 maxlenth: 最多输入多少个字符 size : 文本框长度 --> <h1>注册窗口</h1> <form action="1.我的第一个网页.html" method="post"> <!--文本输入框--> <p>名字: <input type="text" name="Username" value="请输入您地账号" maxlength="8" size="30"></p> <p>密码: <input type="password" name="Passworld"></p> <!-- 单选框标签 type: value: 值 name: 组名 --> <p>性别: 男<input type="radio" value="box" name="sex"/> 女<input type="radio" value="girl" name="sex"/> </p> <!-- 多选框 type value name --> <p>爱好: 睡觉:<input type="checkbox" value="sleep" name="hobby"> 游戏:<input type="checkbox" value="playGrame" name="hobby"> 学习:<input type="checkbox" value="learn" name="hobby"> 吃饭:<input type="checkbox" value="eat" name="hobby"> </p> <!-- 按钮 button 普通按钮 image 图片按钮 submit 提交按钮 reset 重置按钮 --> <p>按钮: <input type="button" name="but1" value="默认值"> <!-- 图片按钮有自动提交地功能 --> <input type="image" src="../resources/imag/3.jpg"> </p> <p> <input type="submit" name="提交"> <input type="reset" name="重置"> </p> </form> </body> </html>
15.列表框和文本域和文件域
1.下拉框: <select name="列表名称" id=""> <option value="选填">China</option> <option value="选填">America</option> <option value="选填" selected>Jpane</option> <option value="选填">India</option> </select>
2.文本域 <p>反馈</p> <p> <textarea name="textarea" id="" cols="30" rows="10"></textarea> </p>
3.文件域 <p> <input type="file" name="files"> </p>
16.搜索框和滑块和简单验证
1.简单验证: <!-- 邮件验证--> 邮箱: <input type="email" name="email"> <!-- --> <p> 数字: <input type="number" name="number" max="100" min="0" step="1"> </p>
2.滑动块 <p> <input type="range" name="voice" min="0" max="100"> </p>
3.搜索框: <p>搜索: <input type="search" name="seach" > </p>
17.只读
readonly 只读 disabled 禁用 value 默认值 hidden 隐藏
18.表单的应用(增强鼠标地可用性)
for="" ----->指向id 地值 id="" ------->自定义 <p> <label for="mark">你点击我试试看 </label> <input type="text" id="mark"> </p>
19.表单地初级验证
placeholder 提示信息 (文本框常用) required 不能为空(文本框常用) pattern (正则表达式) eg: pattern=" "