HTML canvas font 属性

Εγχειρίδιο HTML5 Canvas

定义和用法

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

font 属性使用的语法与 CSS ιδιότητα font相同。

实例

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

Your browser does not support the canvas tag.

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 Χρησιμοποιείται για το κείμενο του στέλεχους κατάστασης του παραθύρου.

Τεχνικές λεπτομέρειες

Προεπιλεγμένη τιμή: 10px sans-serif

Υποστήριξη Browser

Οι αριθμοί στη διάταξη δείχνουν την έκδοση του προγράμματος περιήγησης που υποστηρίζει πλήρως αυτήν την ιδιότητα για πρώτη φορά.

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