HTML <canvas> largeur Attribut
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'attribut largeur spécifie la largeur de l'élément <canvas> , en pixels.
Conseil : Utilisez l'attribut hauteur pour spécifier la hauteur de l'élément <canvas> , en pixels.
Conseil : Chaque fois que la hauteur ou la largeur d'un canvas est réinitialisée, le contenu du canvas sera effacé (voir l'exemple en bas de la page).
Conseil : En savoir plus sur l'élément <canvas> dans notre Tutoriel HTML Canvas .
Support des Navigateurs
Les chiffres dans le tableau spécifient la première version du navigateur qui prend entièrement en charge l'attribut.
| Attribut | |||||
|---|---|---|---|---|---|
| largeur | 4.0 | 9.0 | 2.0 | 3.1 | 9.0 |
Syntaxe
<canvas width=" pixels "> Valeurs des Attributs
| Valeur | Description |
|---|---|
| pixels | Spécifie la largeur du canvas, en pixels (par exemple "100"). La valeur par défaut est 300. |
Plus d'Exemples
Exemple
Effacez le canvas en définissant l'attribut de largeur à 400px (en utilisant JavaScript) :
<canvas id="myCanvas" width="200" height="200" style="border:1px solid"></canvas>
<script>
let c = document.getElementById("myCanvas");
let ctx = c.getContext("2d");
ctx.fillStyle = "#92B901";
ctx.fillRect(50, 50, 100, 100);
function clearCanvas() {
c.width = 400;
}
</script>