canvas教程

HTML5教程:HTML5 Canvas的文本对齐

字号+ 作者:H5之家 来源:H5之家 2015-10-07 14:16 我要评论( )

网页制作文章简介:要对齐HTML5 Canvas的文本,我们可以使用画布的背景下textAlign属性,可以设置居上,底下,居左,中心,或居右。对齐方式是相对的,以一个假

网页制作文章简介:要对齐HTML5 Canvas的文本,我们可以使用画布的背景下textAlign属性,可以设置居上,底下,居左,中心,或居右。对齐方式是相对的,以一个假想的x位置由defind文本的垂直线fillText( )或strokeText( )。除非另有设置,TextAlign属性默认为左,这不禁让我们想起了css

要对齐HTML5 Canvas的文本,我们可以使用画布的背景下textAlign属性,可以设置居上,底下,居左,中心,或居右。对齐方式是相对的,以一个假想的x位置由defind文本的垂直线fillText( )或strokeText( )。除非另有设置,TextAlign属性默认为左,这不禁让我们想起了css属性中的text-align

 

context.textAlign=[value];


window.onload = function(){      var canvas = document.getElementById("myCanvas");      var context = canvas.getContext("2d");         var x = canvas.width / 2;      var y = canvas.height / 2;      context.font = "30pt Calibri";      context.textAlign = "center";      context.fillStyle = "blue";      context.fillText("Hello World!", x, y);  };

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • fd详细教程|Excel_VBA_详细教程

    fd详细教程|Excel_VBA_详细教程

    2017-05-02 18:01

  • html5canvas核心技术图形、动画与游戏开发源码

    html5canvas核心技术图形、动画与游戏开发源码

    2017-05-02 17:42

  • 打印html5中Canvas的方法

    打印html5中Canvas的方法

    2017-05-01 15:03

  • SketchBook 2014 基础入门视频教程

    SketchBook 2014 基础入门视频教程

    2017-05-01 11:00

网友点评
/