HTML canvas font attribute
Définition et utilisation
font est utilisée pour définir ou retourner les attributs de police actuels du contenu texte du canevas.
font La syntaxe de l'attribut Propriété font de CSSIdentique.
Exemple
Écrivez un texte de 40 pixels sur le canevas, en utilisant la police "Arial" :
JavaScript :
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.font="40px Arial";
ctx.fillText("Hello World",10,50);
Syntaxe
context.font="italic small-caps bold 12px arial";
Valeur de l'attribut
| Valeur | Description |
|---|---|
| font-style |
Définir le style de la police. Les valeurs possibles sont :
|
| font-variant |
Définir la variante de la police. Les valeurs possibles sont :
|
| font-weight |
Définir l'épaisseur du texte de la police. Les valeurs possibles sont :
|
| 900 font-size / | Définir la taille et la hauteur de ligne, en pixels. |
| font-family | Définir la série de polices. |
| caption | Utilisez la police pour les contrôles d'en-tête (par exemple, les boutons, les listes déroulantes, etc.). |
| icon | Utilisez la police pour les icônes. |
| menu | Utilisez la police pour les menus (listes déroulantes et listes de menus). |
| message-box | Utilisez la police pour les boîtes de dialogue. |
| small-caption | Utilisez la police pour les petits contrôles. |
| status-bar | Utilisez la police pour la barre d'état de la fenêtre. |
Détails techniques
| Valeur par défaut : | 10px sans-serif |
|---|
Prise en charge du navigateur
Les numéros dans le tableau indiquent la version du navigateur qui prend en charge cette propriété pour la première fois.
| Chrome | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Opera |
| 4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
Remarque :Les versions de Internet Explorer 8 et antérieures ne prennent pas en charge l'élément <canvas>.
