Atribut font HTML canvas

HTML5 Canvas 参考手册

Definisi dan penggunaan

font Atur atau kembalikan atribut huruf konten teks kanvas saat ini.

font Syarat penggunaan atribut CSS font 属性Sama.

Contoh

Tulis kalimat 40 pixel di atas kanvas, gunakan huruf "Arial":

Browser anda tidak mendukung tag canvas.

JavaScript:

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

Coba sendiri

Syarat

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

Nilai atribut

Nilai Deskripsi
font-style

Tetapkan gaya huruf. Nilai yang mungkin:

  • normal
  • italic
  • oblique
font-variant

Tetapkan variasi huruf. Nilai yang mungkin:

  • normal
  • small-caps
font-weight

Tetapkan ketebalan huruf. Nilai yang mungkin:

  • normal
  • tebal
  • lebih tebal
  • lebih halus
  • 100
  • 200
  • 300
  • 400
  • 500
  • 600
  • 700
  • 800
  • 900
font-size / line-height 规定字号和行高，以像素计。
font-family 规定字体系列。
caption 使用标题控件的字体（比如按钮、下拉列表等）。
icon 使用用于标记图标的字体。
menu 使用用于菜单中的字体（下拉列表和菜单列表）。
message-box 使用用于对话框中的字体。
small-caption 使用用于标记小型控件的字体。
status-bar 使用用于窗口状态栏中的字体。

技术细节

默认值： 10px sans-serif

浏览器支持

表中的数字注明了首个完全支持该属性的浏览器版本。

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
4.0 9.0 3.6 4.0 10.1

注释：Internet Explorer 8 以及更早的版本不支持 <canvas> 元素。

HTML5 Canvas 参考手册