Latest web development tutorials

HTML <canvas> -Tag

Beispiele

Mit <canvas> -Element ein rotes Rechteck angezeigt werden:

<Leinwand id = "myCanvas"> </ canvas> <script type = "text / javascript"> var Leinwand = document.getElementById ( 'myCanvas'); var ctx = canvas.getContext ( '2d'); ctx.fillStyle = '# FF0000'; ctx.fillRect (0,0,80,100 ); </ script>

Versuchen »

Browser-Unterstützung

Internet ExplorerFirefoxOperaGoogle ChromeSafari

IE 9, Firefox, Opera, Chrome und Safari unterstützen <canvas> -Tag.

Hinweis: IE 8 oder früheren Versionen von IE - Browser nicht unterstützt <canvas> -Tag.


Tag Definitionen und Anleitungen

<Canvas> Tag Grafiken (wie Diagramme und andere Bilder) durch Scripting zu ziehen (in der Regel JavaScript).

<Canvas> -Tag eine grafische Behälter ist, müssen Sie ein Skript verwenden, Grafiken zu zeichnen.


Die Unterschiede zwischen den HTML 4.01 und HTML5

<Canvas> Tag ist neu in HTML5-Tags.


Tipps und Hinweise

HINWEIS: <canvas> -Element wird in jedem Text angezeigt werden nicht die <canvas> Browser unterstützt.

Tipp: Wenn Siealle Leinwand Objekteigenschaften und Methoden erfahren möchten, finden Sie in der HTML - Leinwand - Referenzhandbuch .


Immobilien

Neu: HTML5 neue Eigenschaft.

属性 描述
height New pixels 规定画布的高度。
width New pixels 规定画布的宽度。

globale Eigenschaften

<Canvas> -Tag unterstützt HTML globale Eigenschaften .


Ereigniseigenschaften

<Canvas> -Tag unterstützt HTML Ereigniseigenschaften .