center 居中标签
1 <center> 2 <h1>用户列表</h1> 3 <a href="">首页</a> | 4 <a href="">添加用户</a> 5 <hr> 6 </center>
font 字体标签
属性：
color 文字的颜色
face 设置文本的字体，设置的字体需要是计算机上安装好的字体；字体安装路径为：c:/windows/fonts
size 文字的大小，值为1~7
<font color="red" face="大傻,二笔,楷体,黑体,宋体" size="7">人到中年不得已，保温杯里泡枸杞！</font>
input标签 定义输入框
属性：
name/value/type
type 规定输入框的值
值： text/password/radio/checkbox
file 文件上传域
hidden 隐藏域，悄悄的传输数据
submit 提交按钮，用value指定按钮的文本
button 普通按钮
image 用图片作为提交按钮，配合src属性使用
reset 重置按钮
1 <form action="../html03/1.php"> 2 用户名： <input type="text" /> <br> 3 密 码： <input type="password" /> <br> 4 性 别： 5 <input name="sex" type="radio" />男 6 <input name="sex" type="radio" />女 7 <input name="sex" type="radio" />鬼 8 <br> 9 头像： <input type="file" /> <br> 10 11 <input type="hidden" name="name" value="中意雷"> 12 13 <input type="checkbox" />我已阅读您的《霸王条款》 <br> 14 15 <button>立即注册</button> 16 <!-- 提交按钮 --> 17 <input type="submit" value="立即注册"> 18 <!-- 普通按钮 --> 19 <input type="button" value="普通"> 20 <!-- 图片作为提交按钮 --> 21 <input type="image" src="./1.png"> 22 <!-- 重置按钮 --> 23 <input type="reset" value="重置按钮"> 24 </form>
input标签
属性： 前面讲过 type/name/value
size 可以设置输入框的宽度
checked 单选框或者多选框的默认选中
maxlength 设置输入框的最大输入长度
readonly 设置为只读
multiple 设置文件上传域为多文件上传
1 <form action="../html03/1.php"> 2 <input readonly name="yukang" size="30" maxlength="6" value="哈哈哈哈"> 3 <input checked type="radio" name="sex">男 4 <input type="radio" name="sex">女 5 <input checked type="radio" name="sex">妖 6 7 <input type="file" multiple> 8 <button>提交</button> 9 </form>
前端验证：包括JavaScript、HTML的验证
仅仅是为了提升用户体验
后端验证才是为了安全
button 按钮标签
属性：
type 决定按钮的类型
值：
button 普通按钮
reset 重置按钮
submit 提交按钮（默认）
//了解
form 规定form标签之外的按钮属于某个form表单
formaction/formmethod/formtarget 会覆盖form标签本来的属性
1 <form id="form1" action="../html03/1.php" method="post"> 2 <input type="text" name="wd"> 3 <button type="reset">重置</button> 4 <button type="button">普通按钮</button> 5 <input type="submit" value="提交"> 6 7 <!-- 提交到百度的按钮 --> 8 <button formmethod="get" formaction="http://www.baidu.com/s" formtarget="_blank">提交到百度</button> 9 </form> 10 11 <!-- 规定当前按钮输入form1的表单 --> 12 <button form="form1">我想提交表单</button>
textarea 可以设置多行文本域
属性：
cols 决定宽度
rows 决定高度
name/readonly
注意：这个双标签不建议换行
select 设置下拉框
属性：
name 给下拉框取名，方便后台拿值
multiple 设置下拉框为多选的（很少用）
option 设置下拉选项
属性：
value 设置option的值；如果不设置，默认拿option中间的内容
selected 设置下拉框的默认选中
1 <form action="../html03/1.php"> 2 自我描述：<input value="213" type="text"><br> 3 自我描述： 4 <textarea cols="50" rows="5"></textarea> 5 <br> 6 收货地址： 7 <select name="sheng"> 8 <option>--请选择--</option> 9 <option value="1">广东省</option> 10 <option value="2">福建省</option> 11 <option selected value="3">四川省</option> 12 <option value="4">东北3省</option> 13 <option value="5">广西省</option> 14 <option selected value="6">广北省</option> 15 <option>广南省</option> 16 </select> 17 18 <button>提交</button> 19 </form>
H5新增的标签
output 用于输出
datalist 设置input框的列表，列表项用option定义
属性：
id 值需要和input标签的list属性的值相对应
H5新增的属性
placeholder 设置提示信息
autofocus 自动获取焦点
required 设置了之后表示必须输入值，不能为空
autocomplete 设置是否提示，值为on/off
min/max/step 设置type为number的输入框的最小值/最大值/步进值
type属性新增的值
number 表示只能输入数字
url 表示只能输入url地址
email 表示只能输入email邮箱地址
range 范围
color 颜色
1 <form action="../html03/1.php"> 2 <!-- 新增标签：datalist --> 3 <input type="text" list="movie"> 4 <datalist id="movie"> 5 <option>毒液</option> 6 <option>拜拜甜甜圈</option> 7 <option>西红柿</option> 8 <option>土豆丝</option> 9 <option>土行孙</option> 10 <option>土槽大会</option> 11 </datalist> 12 13 <hr> 14 <!-- 新增属性 --> 15 <input name="username" autocomplete="off" autofocus placeholder="手机/邮箱/用户名" /> 16 <br> 17 18 <!-- 常用 --> 19 年龄：<input step="5" min="0" type="number" max="30"><br> 20 网址：<input type="url"><br> 21 邮箱：<input type="email"><br> 22 23 <!-- 了解 --> 24 范围：<input name="fw" type="range"><br> 25 颜色：<input name="color" type="color"><br> 26 date：<input type="datetime-local"><br> 27 <button>提交</button> 28 </form>