1、HTML5改进
(1)兼容性 核心理念:保持一切新特性平滑过渡
(2)实用性和用户优先
(3)化繁为简
2、HTML新特性
(1)减少了对外部插件的需求(flash)
(2)更优秀的错误处理
(3)更多取代脚本的标记
(4)HTML5应该独立与设备
(5)用于媒介回放的video和audio元素
3、HTML5最大的改变是可以插入视频与音频
<video>标签定义视频(支持三种格式MP4 WebM Ogg)
<audio>标签定义音频(支持三种格式MP3 Wav Ogg)
<source>标签为媒体元素用来定义媒体资源(一个媒体可定义两个视频或音频文件供浏览器根据其对媒体类型的支持进行选择)
属性:
control 供添加播放 暂停和音量控件
preload 预先加载
muted 静音模式
loop 循环播放
poster 刚开始先出现一副图片
autoplay 自动播放
语法结构:
<video controls >
<source src="视频/音频地址"></source>
<source src="视频/音频地址"></source>
视频无法播放,您的浏览器版本太低。请升级
</video>
4、语义化标签
<header> 定义文档的头部区域
<nav> 标签定义导航链接的部分
<section> 定义文档中的节
<article>定义独立的内容
<aside>定义页面主区域内容之外的内容
<footer>描述文档的底部区域
5、新增块级语义化标签
dialog元素 定义对话或者特殊术语 对话中的每个句子都必须属于<dt>标签所定义的部分 脱离文档流上一层中
<dialog open>
<dt>你好吗?</dt>
<dd>我很好。</dd>
<dt>你真的好吗?</dt>
<dd>我真的很好。</dd>
<dt>.........</dt>
<dd>.......</dd>
</dialog>
6、行内元素
<mark> </mark> 标记一段话 着重表示
<meter></meter> 度量衡 必须定义度量的范围
<progress></progress>表示运行中的进程 无范围
7、新增嵌入式模块和交互式模块(块级模块 智能化选择)
<details>
<summary>HTML5<summary> //标题
HTML5新特性 //解释内容
</details>
用户要求得到且可以得到的细节信息 与summary结合使用
<datalist> 可选数据的列表与input结合使用
<input list="列表id"/> //定义要输入内容的列表
<datalist id="列表id">. //确保找到的列表唯一 所以用id标识
<option>选择1</option>
<option>选择2</option>
</datalist>
8、新增input元素类型(使输入更加智能化识别 方便用户进行操作)
email 邮件号输入时会验证署人员格式是否正确
url 地址同样
number 只输入一个数 且可以规定最大值 最小值 每次递增或者递减数
color 颜色的输入选择
tel 电话号码的输入选择
date month week time datetime 等时间的新输入类型
9、对表单的自动验证
required属性 确保必填
pattern 根据所要求的规则验证用户输入是否正确
autocomplete 自动补全属性