1、HTML5新特性之视频播放——video：
①例：<video src=""></video>
②video标签默认为300*150的inline-block；
③成员属性：
autoplay：是否自动播放；
controls：是否显示播放控件；
currentTime：当前播放到的时间；
duration：总时长；
defaultMuted：默认是否静音；
loop：是否自动循环播放；
muted：当前是否静音；
paused：当前是否处于暂停状态；
poster：""，在视频播放前的显示图片；
volumn：当前播放音量；
preload：预加载内容；取值：auto——自动预加载视频内容，并缓冲一段；metadata——仅预加载影片元素据（宽高时长）；none——不预加载任何数据；
④成员方法：
play();——视频开始播放，paused属性变为false；
paused();——视频暂停，paused属性变为true；
⑤成员事件：
onplay:fn——当调用v.paly()方法时触发；
onpause:fn——当调用v.pause()方法时触发；
2、HTML5新特性之音频播放——audio：
①例：<audio src=""></audio>
②audio标签默认为300*30的inline-block，若不显示播放控件，则display为none；
③成员属性：
autoplay：是否自动播放；
controls：是否显示播放控件；
currentTime：当前播放到的时间；
duration：总时长；
defaultMuted：默认是否静音；
loop：是否自动循环播放；
muted：当前是否静音；
paused：当前是否处于暂停状态；
poster：""，在视频播放前的显示图片；
volumn：当前播放音量；
preload：预加载内容；取值：auto——自动预加载音频元素据内容，并缓冲一段；metadata——仅预加载音频元素据；none——不预加载任何音频数据；
④成员方法：
play();——音频开始播放，paused属性变为false；
paused();——音频暂停，paused属性变为true；
⑤成员事件：
onplay:fn——当调用v.paly()方法时触发；
onpause:fn——当调用v.pause()方法时触发；
⑥IOS系统自带Safari浏览器不支持audio标签，可使用隐藏的video代替；
3、HTML5新特性之Canvas绘图：
①Canvas：画布，默认为300*150的inline-block，设定画布的宽高不能使用CSS Style，只能使用width和height属性；
②Canvas画布本身不能绘制内容，只用于承载被绘制的内容，画笔使用原生JS 创建：var ctx=canvas.getContext('2d');
③Context对象常用属性：
fillStyle:"#000000"——填充样式；
strokeStyle:"#000000"——描边/轮廓样式；
font:"10px sans-serif"——字体大小、类型
textAlign:"start"——文本对齐方式；
textBaseline:"alphabetic"——文本基线；
globalAlpha：——全局不透明度；
lineWidth：线/描边宽度；
shadowOffsetX：阴影在x轴的偏移量；
shadowOffsetY：阴影在y轴的偏移量；
shadowColor:"rgba(0,0,0,0)"——阴影颜色及透明度；
shadowBlur：阴影模糊半径；
④Context对象常用方法：
arc()：绘制一个圆弧/圆形；
beginPath()：开始绘制一条路径；
closePath()：闭合一条路径；
fill()：对路径进行填充；
stroke()：对路径进行描边；
moveTo()：移动到某一点；
lineTo()：绘制到另一点的一条线段；
fillRect()：填充一个矩形；
strokeRect()：描边一个矩形；
clearRect()：清空一个矩形范围内的所有内容；
fillText()：填充一个字符串；
strokeText()：描边一个字符串；
drawImage()：绘制图像；
⑤创建一个线性渐变对象：
var g=ctx.createLinearGradient(x1,y1,x2,y2);
g.addColorStop(offset1,color1);
g.addColorStop(offset2,color2);
⑥绘制矩形（rectangle）：定位点位于左上角
ctx.fillStyle="#000"/渐变对象;——填充样式；
ctx.strokeStyle="#000"/渐变对象;——描边样式；
ctx.lineWidth=;——描边宽度；
ctx.fillRect(x,y,w,h);——填充一个矩形；
ctx.strokeRect(x,y,w,h);——描边一个矩形；
ctx.clearRect(x,y,w,h);——清除一个矩形范围内的内容；
⑦绘制文本（text）：文本定位点在整个字符串文本基线最左边
ctx.textBaseline="alphabetic";//文本基线，可取值为：top/middle/alphabetic/bottom；
ctx.font="10px sans-serif";
ctx.fillText(txt,x,y);
ctx.strokeText(txt,x,y);
ctx.measureText(txt).width;//测量文本宽度；