<toile>


HTML <canvas> Balise

Instance

<!DOCTYPE html> 
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head> 
<body>

<canvas id="myCanvas">你的浏览器不支持 HTML5 canvas 标签。</canvas>

<script>
var c=document.getElementById('myCanvas');
var ctx=c.getContext('2d');
ctx.fillStyle='#FF0000';
ctx.fillRect(0,0,80,100);
</script>

</body>
</html>

Exécuter l'instance»

Cliquez sur le bouton « Exécuter l'instance » pour afficher l'instance en ligne


Prise en charge du navigateur

1000.png

IE 9, Firefox, Opera , Chrome et Safari prennent en charge la balise <canvas>

Remarque : IE 8 ou version antérieure ne prend pas en charge la balise <canvas>


Définition des balises et instructions d'utilisation

La balise <canvas> utilise des scripts (généralement JavaScript) pour dessiner des graphiques (tels que des graphiques et d'autres images). La balise

<canvas> est juste un conteneur pour les graphiques, vous devez utiliser un script pour dessiner les graphiques.


Différences entre HTML 4.01 et HTML5 La balise

<canvas>


Conseils et notes

Remarque : tout texte contenu dans l'élément <canvas> sera affiché dans les navigateurs qui ne prennent pas en charge <canvas>

Astuce : Pour plus d'informations sur toutes les propriétés et méthodes de l'objet canevas, veuillez vous référer au manuel de référence HTML Canvas.


Attribut

Nouveau : Nouvel attribut en HTML5.

PropriétéValeurDescription
hauteurNouveau
属性描述
heightNewpixels规定画布的高度。
widthNewpixels规定画布的宽度。
pixelsSpécifie la hauteur du canevas.
largeurNouveaux

pixelsDispositions La largeur de la toile.
Attributs globaux

La balise <canvas> prend en charge les attributs globaux HTML.

Attributs d'événement

La balise <canvas> prend en charge les attributs d'événement HTML.
<🎜>