Beispiel
A <canvas> Element mit einer Höhe und Breite von 200 Pixeln:
<canvas id="myCanvas" width="200" height="200" style="border:1px solid">
Versuch es selber " Mehr "Versuchen Sie es selbst" Beispiele unten.
Definition und Verwendung
Die height Attribut gibt die Höhe des <canvas> Element in Pixeln.
Tipp: Verwenden Sie die width Attribut die Breite des zu spezifizieren <canvas> Element in Pixeln.
Tipp: Jedes Mal , wenn die Höhe oder Breite eines Leinwand wird neu eingestellt, wird die Leinwand Inhalt (siehe Beispiel am Ende der Seite) gelöscht werden.
Tipp: Erfahren Sie mehr über das <canvas> Element in unserem HTML - Canvas - Tutorial .
Browser-Unterstützung
Die Zahlen in der Tabelle geben Sie die erste Browser-Version, die das Attribut vollständig unterstützt.
| Attribut | |||||
|---|---|---|---|---|---|
| height | 4.0 | 9.0 | 2.0 | 3.1 | 9.0 |
Unterschiede zwischen HTML 4.01 und HTML5
Das <canvas> -Tag ist neu in HTML5.
Syntax
<canvas height="pixels">
Werte Attribut
| Wert | Beschreibung |
|---|---|
| pixels | Gibt die Höhe der Leinwand, in Pixel (zB "100" ). Standardhöhe ist "150" |
Mehr Beispiele
Beispiel
Deaktivieren Sie die Leinwand durch die Einstellung width oder height Attribut (mit JavaScript):
<canvas id="myCanvas" width="200" height="200" style="border:1px
solid"></canvas>
<script>
var c = document.getElementById("myCanvas");
var ctx
= c.getContext("2d");
ctx.fillStyle = "#92B901";
ctx.fillRect(50, 50,
100, 100);
function clearCanvas() {
c.height =
300;
}
</script> Versuch es selber "