为什么字体会变这么大,有没有什么解决办法
<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>
<style>
#canvas{
width: 100%;
height: 100%;
background-color: #000;
}
</style>
<body>
<canvas id="canvas">
</canvas>
</body>
<script>
var can =document.getElementById('canvas');
var ctx =can.getContext("2d");
ctx.fillStyle="#fff";
ctx.font="5px Arial";
ctx.fillText("helloWorld",20,20)
</script>
</html>
问题已经解决了,在此说明下希望帮助到遇到同样问题的同学,就是canvas的宽和高不要设置在css中 不管是外部引入的还是style行间的.直接在canvas后接宽高设置就好了
如下
<canvas id="canvas" width="800px" height="800px">
</canvas>