H5(部分)+C3(选择器/动画)

一. H5新增特性

1. canvas的基本使用

canvas是一个标签，必须设置宽高，画布是canvas的属性
在绘制之前，先通过标签获取画布，通过画布调用绘制方法
获取画布：canvas.getContext("2d")

代码：

显示效果：

绘制直线的流程

1.开始绘制(落笔) beginPath()
2.设置起点 moveTo()
3.设置终点 lineTo()
可以将最后一个终点和起点 相连接 closePath()
4.根据设置的点，来连接 stroke()
save() 保存当前环境的状态
restore() 返回之前保存的路径状态和属性
代码：
显示效果：

线条样式和阴影

属性：

1.fillstyle：设置或返回用于填充绘画的颜色，渐变或模式
属性值：1.color 指示绘图填充色的css颜色值
    2.gradient 用于填充绘画的渐变对象
    3.pattern 用于填充绘图的pattern对象
2.strokestyle：设置或返回用于笔触的颜色，渐变或模式
属性值：1.color 指示绘图笔触颜色的 CSS 颜色值
    2.gradient 用于填充绘图的渐变对象（线性 或 放射性）
    3.pattern 用于创建 pattern 笔触的 pattern 对象
3. shadowColor：设置互殴返回用于阴影的颜色
属性值：color 用于阴影的 CSS 颜色值
4.shadow'Blur：设置或返回阴影的模糊级数
属性值：number，阴影的模糊级数
5.shadowOffsetX/Y：设置或返回阴影与形状的水平/垂直距离

方法：

1.createLinearGradient(x0,y0,x1,y1)：创建线性渐变
属性值：1.x0,y0 渐变开始点的x，y坐标
    2.x1,y1 渐变开始点的x，y坐标
2.createPattern(参数1,参数2) 在指定的方向上重复指定的元素
属性值：参数1:image 规定要使用的模式的图片、画布或视频元素
    参数2:repeat 默认。该模式在水平和垂直方向重复
         repeat-x 该模式只在水平方向重复
         repeat-y 该模式只在垂直方向重复
         no-repeat 该模式只显示一次（不重复）
3.createRadialGradien