今天小编跟大家讲解下有关html5的画布canvas――画出简单的矩形、三角形实例代码 ，相信小伙伴们对这个话题应该有所关注吧，小编也收集到了有关html5的画布canvas――画出简单的矩形、三角形实例代码 的相关资料，希望小伙伴们看了有所帮助。
首先在html页面中放置一个canvas元素 其中canvas元素应该具备三个属性ID、width、height。 复制代码代码如下: <canvas id="demo"width="600"height="600"></canvas> 取得canvas对象并取得上下文var cxt=document.getElementById('demo').getContext("2d");其中参数2d是确定的。 开始绘制 有两种形式 一种是描边（fill） 一种是填充（stroke）。 javascript代码： 复制代码代码如下: <script language="javascript"> var cxt=document.getElementById('demo').getContext("2d"); cxt.beginPath(); cxt.fillStyle="#F00"; cxt.fillRect(0,0,200,100); cxt.beginPath(); cxt.strokeStyle="#000"; cxt.lineWidth=3; cxt.strokeRect(0,120,200,100); cxt.beginPath(); cxt.moveTo(0,350); cxt.lineTo(100,250); cxt.lineTo(200,300); cxt.closePath(); cxt.stroke(); </script> 效果图：来源：爱蒂网
