广州北大青鸟计算机职业培训学校

互联网技术培训、软件技术培训、大数据培训、云计算培训、数据分析培训信息网

当前位置：网站首页 > 培训教程 > Html5 > 正文

HTML5 Canvas - 文本_惠州计算机HTML5培训学校

作者：黄君发布时间：2021-01-21分类：Html5浏览：1089

导读：使用 canvas 绘制文本，重要的属性和方法如下：

使用 canvas 绘制文本，重要的属性和方法如下：

font - 定义字体
fillText(text,x,y) - 在 canvas 上绘制实心的文本
strokeText(text,x,y) - 在 canvas 上绘制空心的文本

使用 fillText():

实例

使用 "Arial" 字体在画布上绘制一个高 30px 的文字（实心）：

下载 (1).png

JavaScript:

var c=document.getElementById("myCanvas");

var ctx=c.getContext("2d");

ctx.font="30px Arial";

ctx.fillText("Hello World",10,50);

使用 strokeText():

实例

使用 "Arial" 字体在画布上绘制一个高 30px 的文字（空心）：

下载 (2).png

JavaScript:

var c=document.getElementById("myCanvas");

var ctx=c.getContext("2d");

ctx.font="30px Arial";

ctx.strokeText("Hello World",10,50);

点击咨询直接了解更多相关资料，我在惠州北大青鸟新方舟等你。

标签：惠州计算机软件培训惠州计算件软件开发惠州计算机软件基础惠州计算机HTML5培训学校惠州HTML5培训

上一篇：HTML5 Canvas - 路径_惠州计算机HTML5培训学校
下一篇：HTML5 Canvas - 渐变_惠州计算机HTML5培训学校

相关推荐

Html5排行

最近发表