国产av日韩一区二区三区精品,成人性爱视频在线观看,国产,欧美,日韩,一区,www.成色av久久成人,2222eeee成人天堂

Canvas basic knowledge

context: context is an object that encapsulates many drawing functions. The method to obtain this object is var context =canvas.getContext("2d");

Perhaps this 2d has aroused everyone’s imagination. , but I regret to tell you that HTML5 does not provide 3D services.


There are two methods for drawing images using canvas elements, namely

context.fill()//Fill

context.stroke()//Draw the border

style: Before drawing graphics, you must set the drawing style

context.fillStyle//Fill style

context.strokeStyle//Border style

context.lineWidth//Graphic border Width

Color representation:

Directly use the color name: "red" "green" "blue"

Hexadecimal System color value: "#EEEEFF"

rgb(1-255,1-255,1-255)

rgba(1-255,1-255,1-255, transparency)

It is so similar to GDI, so friends who have used GDI should be able to get started quickly


Continuing Learning
||
<!DOCTYPE html> <html> <head>  <meta charset="utf-8">  <title>php中文網(wǎng)</title>  </head> <body> <canvas id="demoCanvas" width="500" height="500"> <p>請使用支持HTML5的瀏覽器查看本實例</p> </canvas> <!---下面將演示一種繪制矩形的demo---> <script type="text/javascript"> //第一步：獲取canvas元素 var canvasDom = document.getElementById("demoCanvas"); //第二步：獲取上下文 var context = canvasDom.getContext('2d'); //第三步：指定繪制線樣式、顏色 context.strokeStyle = "red"; //第四步：繪制矩形，只有線。內(nèi)容是空的 context.strokeRect(10, 10, 190, 100); //以下演示填充矩形。 context.fillStyle = "blue"; context.fillRect(110,110,100,100); </script> </body> </html>
submitReset Code