canvas绘制小丑
说明:
借鉴博主基于canvas绘制一个爱心(10行代码就够了) - 掘金 (juejin.cn)
代码实现
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
<style>
*{
margin:0;
padding: 0;
}
#canvas{
border:1px solid #000;
}
</style>
</head>
<body>
<!-- canvas画布 -->
<canvas id="canvas" width="800" height="600"></canvas>
<script>
$(function () {
let canvas = $('#canvas');
let ctx = canvas.get(0).getContext('2d')
// 文字大小
ctx.font='100px 微软雅黑'
ctx.fillStyle = 'pink'
//ctx.fillText('❤',300,300)
ctx.fillText('🤡',300,300)
})
</script>
</body>
</html>