添加与body相同大小的元素时会显示滚动条

Question

当我添加一个与body标签大小相同（宽度+高度）的元素时，我总是得到（不必要的？！）水平和垂直滚动条（在Chrome和FF中测试）。

/* css */
html, body {
height: 100%;
width : 100%;
margin: 0;
padding: 0;
}

/* javascript */
$("<canvas>")
.appendTo("body")
.attr("width", $("body").width())
.attr("height", $("body").height());

Full example at JSFIDDLE.

为什么会出现这些滚动条？主体应足够大，以适应没有滚动条的元素。 从宽度和高度移除4个像素时，滚动条消失。为什么只有4个像素？

Answer 1

它是否与canvas元素的默认填充为2px有关？如果你设置你的css去除画布元素的默认边距和填充会发生什么？

Answer 2

同样的事情发生在我身上，我得到了水平和垂直滚动，我是新手，我不知道为什么会发生这种情况，但是当我在 body 元素中设置 overflow-x: 0; 时它修复了。 我的意思是水平和垂直滚动都消失了。 y 轴溢出时页面垂直滚动。