当我这样做时,我试图让我的 Canvas 适合页面:
ctx.canvas.width = window.innerWidth;
ctx.canvas.height = window.innerHeight;
它只是在水平和垂直方向上添加了滚动条。 它的大小大约是滚动条的大小,在它们出现之前就被考虑在内(只是一个猜测)这是怎么回事,我将如何让它适应没有滚动条的页面。
最佳答案
将 Canvas 位置设置为absolute
。还要确保在包含元素中没有设置填充或边距。
这就是我在所有全屏 Canvas 演示中使用的内容。
body, html {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
overflow: hidden;
}
canvas {
position:absolute;
}
关于HTML5 Canvas 适合窗口,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15525560/