Question

打开这个并检查元素，你会发现画布和顶部之间存在间隙。

如何消除这种差距？

<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>

Answer 1

我猜它是那个给出默认保证金的机构试试这个

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

这应该修复

Answer 2

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

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

具有块显示的画布在div和canvas元素之间仍然存在间隙

2 个答案: