<script>
var ele = document.getElementById("t_con")
var ctx = ele.getContext("2d")
// 字号为60px ,字体为impact
ctx.font = "30px impact"
//将文本填充为棕色
ctx.fillStyle = "#960"
//将文本设为居中对齐
ctx.textAlign = 'center' //规定变换 *** 控点的位置
//设置文字
ctx.fillText("Happy Trails!", 100, 55, 400)//参数为fillText(文本内容, 变换 *** 控点的x坐标, 变换中心的y坐标, 文本最大宽度)
</script>
HTML5新标签canvas来绘制文本文字可以这样做:Shadows API 。
API 的属性为:
shadowColor:阴影颜色。其值和 CSS 颜色值一致。
shadowBlur:设置阴影模糊程度。此值越大,阴影越模糊。其效果和 Photoshop 的高斯模糊滤镜相同。
shadowOffsetX 和 shadowOffsetY:阴影的 x 和 y 偏移量
下面是HTML5代码部分
context.shadowOffsetX = 5
context.shadowOffsetY = 5
context.shadowBlur= 4
context.shadowColor = ‘rgba(255, 0, 0, 0.5)’
context.fillStyle = ‘#00f’
context.fillRect(20, 20, 150, 100)
首先明确canvas是有一个font属性的。利用这个属性我们可以将输入的文字画到画布或者说是已有图片上。先进行最基本的:画布上写字。canvas写字测试您的浏览器不支持canvas标签
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)