HTML canvas font 屬性

2023-05-18 14:19 更新

HTML canvas font 屬性

HTML canvas 參考手冊(cè) HTML canvas 參考手冊(cè)

實(shí)例

在畫布上寫一段 30 像素的文本,使用的字體是 "Arial":

JavaScript:

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

嘗試一下 ?

瀏覽器支持

Internet ExplorerFirefoxOperaGoogle ChromeSafari

Internet Explorer 9、Firefox、Opera、Chrome 和 Safari 支持 font 屬性。

注意:Internet Explorer 8 及之前的版本不支持 <canvas> 元素。


定義和用法

font 屬性設(shè)置或返回畫布上文本內(nèi)容的當(dāng)前字體屬性。

font 屬性使用的語(yǔ)法與 CSS font 屬性 相同。

默認(rèn)值: 10px sans-serif
JavaScript 語(yǔ)法: context.font="italic small-caps bold 12px arial";

屬性值

描述
font-style 規(guī)定字體樣式??赡艿闹担?ul>
  • normal
  • italic
  • oblique
  • font-variant 規(guī)定字體變體。可能的值:
    • normal
    • small-caps
    font-weight 規(guī)定字體的粗細(xì)。可能的值:
    • normal
    • bold
    • bolder
    • lighter
    • 100
    • 200
    • 300
    • 400
    • 500
    • 600
    • 700
    • 800
    • 900
    font-size/line-height 規(guī)定字號(hào)和行高,以像素計(jì)。
    font-family 規(guī)定字體系列。
    caption 使用標(biāo)題控件的字體(比如按鈕、下拉列表等)。
    icon 使用用于標(biāo)記圖標(biāo)的字體。
    menu 使用用于菜單中的字體(下拉列表和菜單列表)。
    message-box 使用用于對(duì)話框中的字體。
    small-caption 使用用于標(biāo)記小型控件的字體。
    status-bar 使用用于窗口狀態(tài)欄中的字體。


    HTML canvas 參考手冊(cè) HTML canvas 參考手冊(cè)
    以上內(nèi)容是否對(duì)您有幫助:
    在線筆記
    App下載
    App下載

    掃描二維碼

    下載編程獅App

    公眾號(hào)
    微信公眾號(hào)

    編程獅公眾號(hào)