oujood.com

HTML canvas attribut hauteur

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

chercher |

Définition et utilisation L'attribut height

LES BALISES HTML

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

Astuce Astuce : Chaque moment Qu'est re-régler la hauteur ou la largeur d'une zone, le contenu de la toile est effacé (voir exemple en bas de page).

Plus d'informations sur l'élément <canvas> dans notre Tutoriel Canvas HTML5.

Syntaxe

<canvas height="pixels">

Valeurs d'attribut

Valeur

Description

pixels

Spécifie la hauteur de la toile, en pixels (par exemple, "100"). hauteur par défaut est « 150 »

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

Exemple :       Copier le code

  <!DOCTYPE html> 
  <html lang="fr"> 
  <head> 
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" > 
  <title>html5 demo</title>
  </head> 
  <body>
  <canvas id="myCanvas" width="200" height="200" style="border:1px solid">Votre
  navigateur ne prend pas en charge la balise canvas.</canvas>
  <script> 
  var c=document.getElementById("myCanvas"); 
  var ctx=c.getContext("2d"); 
  ctx.fillStyle="#92B901"; 
  ctx.fillRect(50,50,100,100); 
  </script> 
  </body> 
  </html>

Appui de navigateur

Internet ExplorerFirefox OperaGoogle ChromeSafari

L'attribut height est pris en charge dans tous les principaux navigateurs.

Remarque : Internet Explorer 8 et versions antérieures, ne supportent pas la balise <canvas>.

Différences entre HTML 4.01 et HTML5

La balise <canvas> est nouveau en HTML5.

Effacer la zone de dessin
Comment faire pour effacer la zone de dessin en utilisant l'attribut width ou height (à l'aide de JavaScript).

Exemple :       Copier le code

  <!DOCTYPE html> 
  <html lang="fr"> 
  <head> 
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" > 
  <title>html5 demo</title>
  </head> 
  <body>
  <canvas id="myCanvas" width="200" height="200" style="border:1px solid"> Votre
  navigateur ne prend pas en charge la balise canvas.</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>
  <button onclick="clearCanvas()">Clear canvas</button> 
  </body> 
  </html>

Retour à la balise canvas

Retour à l'accueil du site

Par carabde 10 mars 2014



Voir aussi nos tutoriel :

JQuery les méthodes pour manipuler HTML

JQuery les méthodes pour manipuler HTML

La pagination avec PHP et MySQL

Ce tutoriel va vous montrer comment sélectionner des données dans une base de données MySQL, les répartir sur plusieurs pages, pour les afficher page par page à l'aide de numéros de page

Objet date javascript

Objet date javascript : L’ est un objet permettant les manipulations des dates et des périodes.