<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<canvas id="aa" width="1111"height="1111"></canvas>
<script>
var aa = document.getElementById('aa');
var bb = aa.getContext('2d');
bb.fillStyle = '#99f'; // 填充颜色
bb.fillRect(0,0,1000,1000);
var img = new Image;
img.src = 'imgs/1.jpg';
img.onload = function () {
bb.drawImage(img, 70,70);
}
bb.fillStyle = '#fff'; // 文字填充颜色
bb.font = '33px Adobe Ming Std';
bb.fillText('怎么得到你想要的?',390,100);
bb.fillStyle = '#fff';
bb.font = '66px Adobe Ming Std';
bb.fillText('让自己配得上!',390,200);
bb.stroke();
</script>
</body>
</html>
canvas插入图片和画文字
最新推荐文章于 2024-08-13 21:57:22 发布