HTML5新增标签--canvas之绘制三角形

<!DOCTYPE html>
<html>

    <head>
        <meta charset="utf-8" />
        <title>绘制三角形</title>
        <style>
            body {
                width: 100%;
                height: 100%;
                background: black;
            }
            
            #canvas {
                background: #ffffff;
            }
        </style>
    </head>

    <body>
        <canvas id="canvas" width="600" height="600">
            
        </canvas>
        <script>
            var oC = document.getElementById("canvas")
            var oGC = oC.getContext("2d")

            oGC.beginPath() //开始路径
            oGC.moveTo(150,100)
            oGC.lineTo(150,200)
            oGC.lineTo(400,200)
            oGC.closePath()
            oGC.stroke()


        </script>
    </body>

</html>

猜你喜欢

转载自blog.csdn.net/AsaZyf/article/details/82699978
今日推荐