Manuel de référence HTML

Tous les balises HTML

Propriété font du canvas HTML

font est Canvas 2D API Description Utilisez les propriétés de style de police actuelles lors du dessin du texte. Utilisez les valeurs de chaîne de caractères identiques aux spécifications CSS font.

Manuel de référence pour HTML canvas

Exemple en ligne

Écrivez un texte sur le canevas 30 pixels de texte, utilisant la police "Arial" :

Exemple

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8>
<title>Utilisation de la propriété font du canvas HTML-基础教程(oldtoolbag.com)</<title>
</<head>
<body>
<canvas id="myCanvas" width="300" height="15" style="border:1px solid #d3d3d3>
Votre navigateur ne prend pas en charge HTML5　balise canvas.
</canvas>
<script>
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.font="30px Arial";
ctx.fillText("基础教程　oldtoolbag.com",10,50);
</script>
</body>
</html>

Voyons voir ‹/›

Compatibilité du navigateur

IEFirefoxOperaChromeSafari

Internet Explorer 9et Safari prennent en charge la propriété font propriété.

Attention :Internet Explorer 8 les versions antérieures à et incluses ne prennent pas en charge l'élément <canvas>.

Définition et utilisation

la propriété font définit ou retourne les attributs de police actuels du texte affiché sur le canevas.

la syntaxe de la propriété font est similaire à propriété CSS font identique.

valeur par défaut :	10px sans-serif
Syntaxe JavaScript :	context.font="italic small-caps bold 12px arial";

Valeur de l'attribut

Valeur	Description
police-style	Spécifiez le style de la police. Les valeurs possibles sont : normal italic oblique
police-variant	Spécifiez la variante de la police. Les valeurs possibles sont : normal small-caps
police-weight	Spécifiez l'épaisseur de la police. Les valeurs possibles sont : normal bold bolder lighter 100 200 300 400 500 600 700 800 900
police-size/line-height	Spécifiez la taille et la hauteur de la ligne, en pixels.
police-family	Spécifiez 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 marquer 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 marquer les petits contrôles.
status-bar	Utilisez la police pour la barre d'état de la fenêtre.

Manuel de référence pour HTML canvas

HTML: <template> balise