// context.fillStyle=color|gradient|pattern;
/* 1、color:
参数(x,y,width,height)
x,y是左上角起始坐标，后两个参数为宽和高
*/
/*2、gradient
createLinearGradient()方法创建线性的渐变对象.
x0渐变开始点的x坐标,y0渐变开始点的y坐标
x1渐变结束点的x坐标,y1渐变结束点的y坐标
*/
/*
createRadialGradient()方法创建放射状/圆形渐变对象。
x0渐变的开始圆的x坐标
y0渐变的开始圆的y坐标
r0开始圆的半径
x1渐变的结束圆的x坐标
y1渐变的结束圆的y坐标
r1结束圆的半径
*/
/*createPattern()方法在指定的方向内重复指定的元素。
context.createPattern(image,"repeat|repeat-x|repeat-y|no-repeat");
image规定要使用的模式的图片、画布或视频元素。
repeat默认。该模式在水平和垂直方向重复。
repeat-x该模式只在水平方向重复。
repeat-y该模式只在垂直方向重复。
no-repeat该模式只显示一次（不重复）。
*/
