带有块显示的画布在 div 和画布元素之间仍然存在间隙答案

【问题标题】：Canvas with block display still has gap between div and canvas element带有块显示的画布在 div 和画布元素之间仍然存在间隙
【发布时间】：2017-10-25 03:38:18
【问题描述】：

打开这个并检查元素，你会看到画布和顶部之间有一个间隙。

如何消除这个差距？

<html>
<title>Canvas demo</title>
<body bgcolor="black" style="overflow: hidden">
<center>
    <div id="game_container">
        <canvas id="canvas" style= "width: 780px; height: 780px; cursor: none;">
        </canvas>
    </div>
</center>
</body>

<script>
var canvas = document.getElementById('canvas');
canvas.style.display = 'block';
</script>

【问题讨论】：

标签： javascript css html canvas

【解决方案1】：

我猜它是那个给出默认边距的主体试试这个

html,body,canvas{margin:0;padding:0;border:0;font-size: 100%;width:100%;height:100%;}

这应该可以解决

【讨论】：

【解决方案2】：

对于这种情况，您可以使用重置 css。

canvas {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

【讨论】：