首先,canvas:固定在浏览器上的画布,浏览器支持
Internet Explorer 9、Firefox、Opera、Chrome 以及 Safari 支持 及其属性和方法。
canvas为我们敞开了新一扇大门。
属于HTML5中新增的一个标签,看起来与其他标签区别不大,在验证码之前,应该学习canvas相关API,
这里介绍本次用到的canvas方法 :
fillStyle 设置或返回用于填充绘画的颜色、渐变或模式
strokeStyle 设置或返回用于笔触的颜色、渐变或模式
fillRect() 绘制“被填充”的矩形
stroke() 绘制已定义的路径
moveTo() 把路径移动到画布中的指定点,不创建线条
lineTo() 添加一个新点,然后在画布中创建从该点到最后指定点的线条
arc() 创建弧/曲线(用于创建圆形或部分圆)
font 设置或返回文本内容的当前字体属性
更多请参考w3c文档w3c
- html
<canvas id="canvas" width="120" height="30"></canvas>
- css
#canvas{
cursor: pointer;
/*border: 1px solid red;*/
}
- js
var canvas =