font
Canvas font xususiyati
Misol
"Arial" shriftidan foydalanib, canvas’ga balandligi 30px bo‘lgan matn yozing:
JavaScript:
const canvas = document.getElementById("myCanvas");
const ctx = canvas.getContext("2d");
ctx.font = "30px Arial";
ctx.fillText("Hello World", 10, 50);
O‘zingiz sinab ko‘ring »
Tavsif
font xususiyati canvas matni uchun shrift xususiyatlarini o‘rnatadi yoki qaytaradi.
font xususiyati CSS font xususiyati bilan bir xil sintaksisdan foydalanadi.
Standart qiymat — 10px sans-serif.
Shuningdek qarang:
fillStyle xususiyati (matn rangi/gradientini o‘rnatish)
textAlign xususiyati (matnni tekislashni o‘rnatish)
textBaseline xususiyati (matnning asosiy chizig‘ini o‘rnatish)
fillText() metodi (matnni chizish)
strokeText() metodi (matnni chizish)
Sintaksis
| context.font = "italic small-caps bold 12px arial" |
Xususiyat qiymatlari
| Qiymatlar | Tavsif | Sinab ko‘rish |
|---|---|---|
| font-style |
|
Sinab ko‘rish » |
| font-variant |
|
Sinab ko‘rish » |
| font-weight |
|
Sinab ko‘rish » |
| font-size | Shrift o‘lchami, piksellarda | Sinab ko‘rish » |
| font-family | Shrift oilasi | Sinab ko‘rish » |
| caption | Tugmalarda ishlatiladigan shriftdan foydalanish | Sinab ko‘rish » |
| icon | Ikonka yorliqlarida ishlatiladigan shriftdan foydalanish | Sinab ko‘rish » |
| menu | Menyularda ishlatiladigan shriftdan foydalanish | Sinab ko‘rish » |
| message-box | Dialog oynalarida ishlatiladigan shriftdan foydalanish | Sinab ko‘rish » |
| small-caption | Kichik boshqaruv elementlarining yorliqlarida ishlatiladigan shriftdan foydalanish | Sinab ko‘rish » |
| status-bar | Oyna holat panelida ishlatiladigan shriftlardan foydalanish | Sinab ko‘rish » |
Brauzerlarda qo‘llab-quvvatlash
<canvas> elementi HTML5 standartidir (2014).
font barcha zamonaviy brauzerlarda qo‘llab-quvvatlanadi:
| Chrome | Edge | Firefox | Safari | Opera | IE |
| Ha | Ha | Ha | Ha | Ha | 9-11 |
❮ Canvas ma’lumotnomasi
W3Schools Pathfinder
Yutuqlaringizni kuzating – bu bepul!