Heim  >  Artikel  >  Web-Frontend  >  HTML5-Canvas

HTML5-Canvas

(*-*)浩
(*-*)浩Original
2019-10-24 15:11:492213Durchsuche

Das Canvas-Element wird zum Zeichnen von Grafiken auf Webseiten verwendet.

HTML5-Canvas

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!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn