当前位置:首页 » HTML » 正文

HTML5中canvas文字绘制

496 人参与  2017年02月10日 14:46  分类 : HTML  点这评论

绘制文字时可以使用fillText方法或strokeText方法。

ØfillText方法用填充方式绘制字符串,该方法的定义如下所示。

void fillText(text,x,y,[maxWidth]);

该方法接受四个参数,第一个参数text表示要绘制的文字,第二个参数x表示绘制文字的起点横坐标,第三个参数y表示绘制文字的起点纵坐

标,第四个参数maxWidth为可选参数,表示显示文字时的最大宽度,可以防止文字溢出。

ØstrokeText方法用轮廓方式绘制字符串,该方法的定义如下所示。

void stroke text(text,x,y,[maxWidth]);

该方法参数功能与fillText方法相同

在绘制文字前,先对该对象的有关文字绘制属性进行设置,主要有如下几个属性:

font属性:设置文字字体

textAlign属性:设置文字水平对齐方式,属性值可以为start、end、left、right、center。默认是start

testBased属性:设置文字垂直方式,属性为top、hanging、middle、alphabetic,ideographic、bottom。默认为alphabetic。

下面是实例,点击看

来源:太阳笑了博客:感恩有你一路相伴(QQ号:1368396530),转载请保留出处和链接!

本文链接:http://www.taiyangxiao.com/post/347.html

本文标签:HTML  

<< 上一篇 下一篇 >>

  • 评论(0)
  • 赞助本站

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。

相关文章

最近发表

    网站分类

    最新留言

    我是公告

      感谢大家访问我的博客,如果大家喜欢我的内容,请友情支持一下,点击下面广告吧!

    皖ICP备16018029号|本站已安全运行了天| 信用认证 |

    博客大全 卢松松博客 中国博客联盟 boke112导航 米鱼博客

    快捷导航返回顶部

    分享:

    支付宝

    微信