Atribut tulisan Canvas

Definisi dan penggunaan

font Atribut untuk menetapkan atau mengembalikan atribut font teks yang saat ini di atas kanvas.

font Sintaks atribut yang digunakan sama seperti Properti font CSSSama.

Contoh

Tulis kalimat 40 piksel di atas kanvas, gunakan font "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

Sintaks

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

Nilai atribut

Nilai Deskripsi
font-style

Tentukan gaya tulisan. Nilai yang mungkin:

  • normal
  • italic
  • oblique
font-variant

Tentukan variasi tulisan. Nilai yang mungkin:

  • normal
  • small-caps
font-weight

Tentukan ketebalan tulisan. Nilai yang mungkin:

  • normal
  • bold
  • bolder
  • lighter
  • 100
  • 200
  • 300
  • 400
  • 500
  • 600
  • 700
  • 800
  • 900
font-size / line-height Tentukan ukuran dan tinggi baris, dalam piksel.
font-family Tentukan serupa tulisan.
caption Gunakan font untuk kontrol judul (seperti tombol, daftar turun, dll.).
icon Gunakan font untuk menandai ikon.
menu Gunakan font untuk menu (daftar turun dan daftar menu).
message-box Gunakan font untuk dialog.
small-caption Gunakan font untuk menandai kontrol kecil.
status-bar Gunakan font untuk bantuan status bar jendela.

Detil Teknologi

Nilai Default: 10px sans-serif

Dukungan Browser

Angka di tabel menunjukkan versi browser pertama yang mendukung atribut ini penuh.

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

Keterangan:Internet Explorer 8 dan versi sebelumnya tidak mendukung elemen <canvas>.