Canvas font 属性

定义和用法

font 属性设置或返回画布上文本内容的当前字体属性。

font 属性使用的语法与 Propriété font de CSS相同。

实例

在画布上写一段 40 像素的文本,使用的字体是 "Arial":

您的浏览器不支持canvas标签。

JavaScript:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.font="40px Arial";
ctx.fillText("Hello World",10,50);

亲自试一试

语法

context.font="italic small-caps bold 12px arial";

属性值

描述
font-style

规定字体样式。可能的值:

  • normal
  • italic
  • oblique
font-variant

规定字体变体。可能的值:

  • normal
  • small-caps
font-weight

规定字体的粗细。可能的值:

  • normal
  • bold
  • bolder
  • lighter
  • 100
  • 200
  • 300
  • 400
  • 500
  • 600
  • 700
  • 800
  • 900
font-size / line-height 规定字号和行高,以像素计。
font-family 规定字体系列。
caption 使用标题控件的字体(比如按钮、下拉列表等)。
icon 使用用于标记图标的字体。
menu 使用用于菜单中的字体(下拉列表和菜单列表)。
message-box 使用用于对话框中的字体。
small-caption 使用用于标记小型控件的字体。
status-bar Utilisez la police pour la barre d'état de la fenêtre.

Détails techniques

Valeur par défaut : 10px sans-serif

Support 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 :Internet Explorer 8 et les versions antérieures ne prennent pas en charge l'élément <canvas>.