Javascript 画布上的额外边距_Javascript_Html_Css_Margin

Javascript 画布上的额外边距

javascript html css

Javascript 画布上的额外边距,javascript,html,css,margin,Javascript,Html,Css,Margin,我正在尝试制作一个完全适合方形浏览器的画布。问题是在屏幕的左上角不断增加额外的边距，我无法摆脱它。你知道我该怎么解决这个问题吗代码 <!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> </head> <style type="text/css"> #gameCanvas { background-color: blue; } </style&

我正在尝试制作一个完全适合方形浏览器的画布。问题是在屏幕的左上角不断增加额外的边距，我无法摆脱它。你知道我该怎么解决这个问题吗

代码

<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
</head>
<style type="text/css">

#gameCanvas {
    background-color: blue;
}

</style>

<canvas id="gameCanvas"></canvas>
<script type="text/javascript">
    var canvas = document.getElementById("gameCanvas");  
    canvas.width = window.innerWidth;
    canvas.height = window.innerWidth;
</script>
<script src="cocos2d.js"></script>
</body>
</html>


#游戏画布{
背景颜色：蓝色；
}
var canvas=document.getElementById（“gameCanvas”）；
canvas.width=window.innerWidth；
canvas.height=window.innerWidth；

浏览器有默认样式表，包括边距、填充等。试试这个：

body {
    padding: 0;
}

一般来说，CSS重置在覆盖默认样式时非常方便。

浏览器有默认样式表，包括边距、填充等。试试这个：

body {
    padding: 0;
}

一般来说，CSS重置在覆盖默认样式时非常方便。

正如@Katherine Huang所说，浏览器有默认样式表，包括边距、填充

您可以设置：

html, body{
    margin:0;
    padding:0;
}
#gameCanvas{
    margin:0;
    padding:0;
    background-color: blue;
}

现在，您必须在正文中的每个新元素上设置特定的边距和填充，因为默认情况下它们将有0。

正如@Katherine Huang所说，浏览器有默认样式表，其中包括边距、填充

您可以设置：

html, body{
    margin:0;
    padding:0;
}
#gameCanvas{
    margin:0;
    padding:0;
    background-color: blue;
}

现在您必须在正文中的每个新元素上设置特定的边距和填充，因为默认情况下它们将有0。

如何

*{padding:0；margin:0；}

是通用选择器，因此这将为所有元素将填充和边距设置为0。如何

*{padding:0；margin:0；}

是通用选择器，因此这将为所有元素将填充和边距设置为0。