格式化文字
fillText
和 strokeText
方法提供的預設字型格式在美學上並不具有吸引力。幸運的是,canvas API 提供了格式化文字的屬性。
使用 font
屬性,你可以指定:
- 字型樣式
- 字型變形
- 字型重量
- font-size / line-height
- 字型系列
例如:
ctx.font = "italic small-caps bold 40px Helvetica, Arial, sans-serif";
ctx.fillText("My text", 20, 50);
結果:
使用 textAlign
屬性,你還可以將文字對齊方式更改為:
- 剩下
- 中央
- 對
- 結束(與右一樣)
- 開始(和左一樣)
例如:
ctx.textAlign = "center";