Artikeleinführung von Wulin.com (www.vevb.com): HTML5-CANVAS-Tag-Drawing-Rechtecke.
<! DocType html>
<html>
<kopf>
<meta charset = 'utf-8'>
<title> html5-canvas tag-draw rechteck </title>
</head>
<body>
<Canvas ID = 1 Breite = 200 Höhe = 200> </canvas>
<script type = text/javaScript>
window.onload = function () {
var canva = document.getElementById ('1')
var content = canva.getContext ('2d')
Content.FillStyle = #ccc; // Füllen Sie die Hintergrundfarbe von Canvas
Content.FillRect (0, 0, 200, 200); // Die Parameter repräsentieren die X-Achse, die Y-Achse, die Breite bzw. der Höhe
Content.lineWidth = 4; // Grenzbreite
content.strokestyle = #fff; // Grenzfarbe
Content.Strokerect (50,50,100.100); // Grenzkoordinaten und Größen
Content.FillStyle = #f00; // Rechteck -Füllfarbe
Content.FillRect (50,50,100,100); // Rechteckkoordinaten und Größe
}
</script>
</body>
</html>