nav 导航
header 页眉
footer 页脚
main 文档主要内容
article 文章
aside 主题内容之外
footer 文档 页脚
main > article main标签 下的 article 标签
ie8 引入第三方插件
html5shiv.min.js
html5 新增的表单属性
需要@符号 包含域名
邮箱<input type="email" >
tel不能实现验证 目的是移动端打开数字键盘
电话<input type="tel" >
必须输入合法的网址 必须包含http
网址<input type="url" >
数量<input type="num" value="" 默认值 min=""最小值 max=""最大值>
搜索<input type="search" />
范围
<input type="range" max="" min="" value=""> 默认50 最大100 最小0
颜色
<input type="color" >选择颜色
时间
<input type="date" > 年月日
time 一天的时间 时分秒
datetime 总时间 年月日时分秒 大多数浏览器不支持 苹果支持
datetime-local 大多数浏览器支持
month 月份
week 周
新属性
placeholder 提示文本
autofocus 自动焦点
autocomplete on off 自动完成 必须成功提交过 提交才会有记录
必须要name属性
required 必须输入
pattern 正则匹配
file input
multiple 多个提交
email multiple 多个提交以逗号分隔
超出form的元素 就没法提交
这时候就可以使用
<input type="text" name="address" form="form的ID" >
<select>
<option></option>
<select>
不仅可以选择 还应该可以输入 不常用datalist firefox不支持
datalist
value 具体值 label提示信息
<input type="text" list="subjects">
<datalist id="subjects">
<option value="a" label="提示信息">a</option>
</datalist>
网址 type url urls 必须添加http://
<input type="url" list="urls">
<datalist id="urls">
<option value="http://www.baidu.com" label="百度"></option>
<option value="http://www.sohu.com" label="搜狐"></option>
</datalist>
keygen元素 密钥对生成器
非对称加密 支持率较低
<keygen></keygen>
显示输出信息 显示 无法修改
<output></output>
新事件
oninput 监听当前制定元素内容的改变 只要内容改变 添加内容 删除内容 触发
onkeyup 每一个键弹起触发一次 粘贴keyup 没有监听
oninvalid 验证不通过触发
document.getElementByid("userphone").oninvalid(=>{
this.setCustomValidity("设置提示信息")
})
进度条
<progress max="100" value="50"></progress>
度量器 衡量当前进度值
high规定的较高的值
low 规定的较低的值
max 最大值
min 最小值
value 当前度量值
<meter></meter>
<fieldset>
<legend>档案</legend>
</fieldset>
box-sizing:border-box width 内容+ padding+border
border-radius 4px 圆角