如何使HTML canvas for emscripten without borders

Question

我有一个简单的 C++ SDL2 程序，我正在使用 emscripten 在浏览器中运行它。 Emscripten 生成两个文件（javascript 和 webassembly）并将所有内容渲染到 HTML canvas。我在互联网上找到了这个简单的 HTML canvas，它工作得很好，但由于某种原因，它在左侧和顶部有白色边框。我怎样才能去除这些边框？这是 HTML 代码：

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    </head>
    <body>
        <canvas id="canvas" oncontextmenu="event.preventDefault()"></canvas>
        <script type='text/javascript'>
            var Module = {
                canvas: (function() { return document.getElementById('canvas'); })()
            };
        </script>
        <script src="index.js"></script>
    </body>
</html>

screenshot here

Answer 1

这是 body 元素的浏览器默认边距。您可以通过向头部元素添加一些 CSS 来删除它。

示例：

<style>
    body {
        margin: 0;
    }
</style>

如何使HTML canvas for emscripten without borders

How to make HTML canvas for emscripten without borders

html

emscripten