1.<form>
<form></form>
属性
action:提交地址
date:数据
replace:定义提交表单所做的事情
method:提交方式 get post
autocomplete:用户键入提示之间键入的值
novalidate:不验证
target:打开目标URL
_blank:在新窗口打开
_parent:在上一级窗口打开
_self:在当前窗口
_top:显示在顶级窗口
2.输入标记<input>
<input></input>
属性
type:输入类型
name:名字
value:设置显示内容
size:宽度
maxlenght:输入最大长度
(1)type类型
普通按钮: <input type="button" value="按钮">
提交按钮:<input type="submit">
图像按钮:<input type="image" src="">
文本:<input type="text">
数字:<input type="number">
邮箱: <input type="email" value="@">
链接: <input type="url" value="http://">
搜索框:<input type="search">
电话号码: <input type="tel">
颜色: <input type="color">
时间(带控件年月日): <input type="date">
时间:<input type="datetime">
时间(带控件时分秒): <input type="datetime-local">
时间选择器(时分)<input type="time">
月份:<input type="month">
星期:<input type="week">
数字选择器:<input type="range" >
密码输入框:<input type="password">
单选框:<input type="radio" name="sex">男
<input type="radio" name="sex">女
复选框: <input type="checkbox" >篮球
<input type="checkbox" >足球球
<input type="checkbox" >乒乓球
重置按钮: <input type="reset">
隐藏按钮: <input type="hidden">
(2)autofocus属性:自动聚焦 参数 false与true 注意:不能添加在hidden(隐藏按钮上)一个页面只能添加一个autofocus
(3)disabled: 是否禁用表单 参数:true:禁用,无法输入 不能添加到hidden上
(4)form:指定所属的表单名
(5)pattern:规定输入值格式
(6)step:输入值自增
(7)placeholder:提示文字
(8)readonly:只读
(9)require:必填项
3.下拉列表
<select>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
</select>
属性:
multiple:实现多选
4.多行文本标记
<textarea>
</textarea>
属性:
name:名称
rows:控制行数
cols:控制列数
warp: 是否换行 off 不换行,hard:自动换行 换行提交到服务器,soft自动换行,不提交的服务器默认值
5.绑定标记<label></lable>
<label for="usenname" >usename<label>
<input type=“text” name="username>
6.加密
<keygen >
例1 学生信息登记表
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>表单</title>
</head>
<body >
<form>
<table align="center" border="1" cellspacing="1" width="500px">
<caption>学生信息登记表</caption>
<tr>
<th>姓名:</th>
<td><input type="text"></td>
</tr>
<tr>
<th>学号:</th>
<td><input type="number"></td>
</tr>
<tr>
<th>入学时间:</th>
<td><input type="datetime-local"></td>
</tr>
<tr>
<th>自设密码:</th>
<td><input type="password"></td>
</tr>
<tr>
<th>性别:</th>
<td>
<input type="radio" name="sex">男
<input type="radio" name="sex">女
</td>
</tr>
<tr>
<th>爱好:</th>
<td>
<input type="checkbox" >篮球
<input type="checkbox" >足球球
<input type="checkbox" >乒乓球
</td>
</tr>
<tr>
<th>年级:</th>
<td>
<select>
<option>2016</option>
<option>2017</option>
<option>2018</option>
<option>2019</option>
</select>
</td>
</tr>
<tr>
<th>个人说明:</th>
<td>
<textarea cols="10" role="10" slot="off"></textarea>
</td>
</tr>
<tr>
<th></th>
<td>
<input type="submit" value="提交">
<input type="reset" value="重置">
<button>忘记密码</button>
</td>
</tr>
</table>
</form>
</body>
</html>