HTML5 Canvas始终具有滚动条

Question

我在我的网页上有这个画布，但每当我加载它时，无论我调整屏幕的大小，它总是以水平和垂直轴的滚动条结束。我怎样才能解决这个问题？我的显示器确实有不同的宽高比，这对它有什么影响吗？我无法提供任何推荐代码，因为我唯一一次提到宽度和高度是我第一次设置值：

canvas.width = 1280;
canvas.height = 720;

非常感谢帮助，我现在处于危机之中XD

编辑： 这有点无关紧要，但这是codepen

上的所有代码

Answer 1

只需添加box-sizing：

canvas {
        box-sizing: border-box;
        border: 1px solid black;
        height: 100vh;
        width: 100vw;
}

滚动条出现的原因是canvas元素使用超出窗口边界的边框。

Answer 2

尝试使用css的vh和vw属性。应使用您的屏幕垂直高度作为默认值。应该有所帮助将它们设置为100。