Heim > Artikel > Web-Frontend > HTML5-Canvas
Das Canvas-Element wird zum Zeichnen von Grafiken auf Webseiten verwendet.
Was ist Canvas?
Das Canvas-Element von HTML5 verwendet JavaScript, um Bilder auf einer Webseite zu zeichnen. (Empfohlenes Lernen: HTML-Tutorial)
Die Leinwand ist ein rechteckiger Bereich, und Sie können jedes Pixel davon steuern.
Canvas bietet viele Möglichkeiten zum Zeichnen von Pfaden, Rechtecken, Kreisen und Zeichen sowie zum Hinzufügen von Bildern.
Canvas-Element erstellen
Canvas-Element zur HTML5-Seite hinzufügen.
Gibt die ID, Breite und Höhe des Elements an:
<canvas id="myCanvas" width="200" height="100"></canvas>
Zeichnen über JavaScript
Das Canvas-Element selbst verfügt über keine Zeichenfunktionen. Alle Zeichenarbeiten müssen in JavaScript erfolgen:
<script type="text/javascript"> var c=document.getElementById("myCanvas"); var cxt=c.getContext("2d"); cxt.fillStyle="#FF0000"; cxt.fillRect(0,0,150,75); </script>
Das obige ist der detaillierte Inhalt vonHTML5-Canvas. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!