学习canvas画布

我们可以用画布(Canvas)绘制各种图形,下面代码是绘制的一个圆形:

<!DOCTYPE html>
<html>
    <head>
        <title>Canvas画布</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <style>
            #canvas{width: 200px; height: 200px; border: 1px solid #d3d3d3;}
        </style>
    </head>
    <body>
        <div>绘制一个圆</div>
        <canvas id="canvas">您的浏览器不支持HTML5 canvas 标签。</canvas>
        <script>
            var canvas=document.getElementById("canvas");
            canvas.width=200;
            canvas.height=200;
            var context=canvas.getContext("2d");
            context.beginPath();
            context.arc(100,50,50,0,2*Math.PI);
            context.stroke();
        </script>
    </body>
</html>

HTML5标准规范:HTML5标准规范

HTML5代码规范:HTML5代码规范

HTML5 canvas绘制图片模糊的问题

HTML5 canvas绘制图片模糊的问题2

原文地址:https://www.cnblogs.com/hool/p/11281619.html