Canvas绘制基本线条的方式
什么是Canvas
- Canvas,顾名思义,是一块“画布”,Canvas有着默认的宽(300px)、高(150px);
<canvas id="myCanvas" width="300" height="150"></canvas>
(默认状态下的值), 即为
<canvas id="myCanvas"></canvas>
不改变Canvas内的宽、高值,下面的值超过部分将被遮住。
实例:绘制一个黄色的矩形:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<canvas id="myCanvas">您的浏览器不支持canvas标签</canvas>
<script>
var canvas=document.getElementById('myCanvas');
var ctx=canvas.getContext('2d');
ctx.fillStyle='#fff000';// 样式:颜色
ctx.fillRect(0,0,80,100); // (起始位置(left)),(起始位置(top)),宽&#x