Attribut HTML <canvas> hauteur

❮ Balise HTML <canvas>

Exemple

Un élément <canvas> avec une hauteur et une largeur de 200 pixels :

<canvas id="myCanvas" width="200" height="200" style="border:1px solid">

Plus d'exemples "Essayez-le vous-même" ci-dessous.


Définition et utilisation

L' heightattribut spécifie la hauteur de l' <canvas>élément, en pixels.

Astuce : Utilisez l' width attribut pour spécifier la largeur de l' <canvas>élément, en pixels.

Astuce : Chaque fois que la hauteur ou la largeur d'un canevas est réinitialisée, le contenu du canevas sera effacé (voir l'exemple en bas de page).

Conseil : Apprenez-en plus sur l' <canvas>élément dans notre didacticiel HTML Canvas .


Prise en charge du navigateur

Les nombres dans le tableau indiquent la première version du navigateur qui prend entièrement en charge l'attribut.

Attribute
height 4.0 9.0 2.0 3.1 9.0

Syntaxe

<canvas height="pixels">


Valeurs d'attribut

Value Description
pixels Specifies the height of the canvas, in pixels (e.g. "100"). Default value is 150

Plus d'exemples

Exemple

Effacez le canevas en définissant l'attribut width ou height (à l'aide de 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>

❮ Balise HTML <canvas>