在html5的画布上,怎么使文字变大并加粗显示?

在html5的画布上,怎么使文字变大并加粗显示?,第1张

canvas有一个font属性,用font属性先设定好文字的字体,加粗,倾斜,字号,然后用fillText 或者strokeText插入文字就好了,

给个例子:

<!DOCTYPE HTML>

<html>

<head>

<script type="text/javascript">

window.onload=function () {

var content = document.getElementById("canvas")

var cxt = content.getContext("2d")

cxt.font = "bold 30px Arial"

//fillText方式

cxt.fillText("随便写点儿啥", 50, 50)

}

</script>

</head>

<body>

<canvas id="canvas" width="300" height="300"></canvas>

</body>

</html>

你好,将图片绘制到canvas之后,原图片上的所有属性和方法以及时间在canvas上的图片上都将不再产生作用,因为图片在canvas是以像素的形式存在,而不是DOM元素。如果一定要用,这需要将时间绑定到canvas上,并且画板上的内容清除之后再重新绘制一幅带有边框的图片(这里需要作一些绘图运算)


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/6243476.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-03-19
下一篇 2023-03-19

发表评论

登录后才能评论

评论列表(0条)

保存