去除 <canvas> 元素周围的填充/边距？

Question

Answer 1

我遇到了类似的问题，当我将 div 放置在页面底部时，内部带有画布的绝对定位的 div（通过 JS 添加，因此周围没有多余的空格）导致页面溢出。

解决方案是将画布显示属性设置为“block”（当时不知道默认情况下它是“inline-block”），现在不再添加额外的填充，滚动条也消失了。

Answer 2

正如您所正确指出的，浏览器为各种 HTML 元素实现默认样式（并且它们不是标准化的，因此每个浏览器实现的默认样式略有不同）。出于您的目的，鉴于您发布的 HTML，您需要类似以下内容：

html, body, div, canvas {
    margin: 0;
    padding: 0;
}

当然，这确实过于简化了事情，并且可能值得设置

font-size

和默认

color

和

background-color

属性（以及许多，many 其他属性）。

参考资料：

Answer 3

html 页面的默认 body 元素应用了填充。

使用以下 CSS 显式删除此内容：

body{
    margin: 0;
}

您现在应该看到类似以下内容：