title:/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ CanvasContext.font header:/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ develop nav:/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ api

sidebar:/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ canvas_CanvasContext-font

/uploads/projects/swan-docs/program-docs/docs/develop/api/show/

解释：设置当前字体样式的属性。 /uploads/projects/swan-docs/program-docs/docs/develop/api/show/

/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ 方法参数/uploads/projects/swan-docs/program-docs/docs/develop/api/show/

String/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ value/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ ：符合/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ CSS/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ font/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ 示例的/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ DOMString/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ 字符串，至少需要提供字体大小和字体族名，有效值为/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ 10px/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ sans-serif/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ 。/uploads/projects/swan-docs/program-docs/docs/develop/api/show/

/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ value/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ 支持的属性有/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ ：

|/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ 属性/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ |/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ 说明/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ | |——/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ |/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ ——/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ | |/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ style/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ |/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ 字体样式，有效值/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ italic,/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ oblique,/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ normal。/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ | |/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ weight/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ |/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ 字体粗细，有效值/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ normal,/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ bold。/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ | |/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ size/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ |/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ 字体大小/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ | |/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ family/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ |/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ 字体族名，注意确认各平台所支持的字体/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ 。|

/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ 示例

在开发者工具中预览效果/uploads/projects/swan-docs/program-docs/docs/develop/api/show/

/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ 扫码体验

/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ sidebar:/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ canvas_CanvasContext-font - 图1 /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ 请使用百度APP扫码

/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ 图片示例/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/

/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/
/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ sidebar:/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ canvas_CanvasContext-font - 图2 /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/
/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/
/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ sidebar:/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ canvas_CanvasContext-font - 图3 /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/
/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/

/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ 代码示例/uploads/projects/swan-docs/program-docs/docs/develop/api/show/

:::codeTab /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ 

  1. Page({
  2. /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ onReady:/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ function/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ ()/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ {
  3. /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ let/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ canvasContext/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ =/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ swan.createCanvasContext('myCanvas');
  4. /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ canvasContext.font/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ =/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ "40px/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ Microsoft/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ YaiHei";
  5. /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ canvasContext.fillText('微软雅黑',/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ 90,/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ 90);
  6. /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ 
  7. /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ canvasContext.font/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ =/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ "50px/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ 楷体";
  8. /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ canvasContext.fillText('楷体',/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ 90,/uploads/projects/swan-docs/program-docs/docs/develop/api/show/ 200);
  9. /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ canvasContext.draw();
  10. /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ /uploads/projects/swan-docs/program-docs/docs/develop/api/show/ }
  11. });

:::