HTML5 Dessiner un rectangle dans un canevas avec les compétences du didacticiel Renders_html5

1. Dessinez un rectangle

Canvas utilise un système de coordonnées avec l'origine (0,0) dans le coin supérieur gauche. La coordonnée x augmente vers la droite et la coordonnée y augmente vers le bas.

Utilisez la fonction de dessin de rectangle de l'environnement de dessin pour dessiner le rectangle.

fillRect(x,y,width,height) : dessinez un rectangle solide.
StrokeRect(x,y,width,height) : dessinez un rectangle creux.
clearRect(x,y,width,height) : Efface la zone rectangulaire spécifiée pour la rendre complètement transparente.

2. Dessinez un rectangle dans le canevas

Copiez le code

Le code est le suivant :

;!--Si le navigateur ne le prend pas en charge, la police suivante sera affichée-->
Conseil : Votre navigateur ne prend pas en charge la balise
;/body>




3. Effet de dessin