Extra Rand in Leinwand

Ich versuche, eine Leinwand, die perfekt in einem quadratischen Browser passt. Das Problem ist, dass dieser zusätzliche Rand oben und links vom Bildschirm bleibt und ich kann ihn nicht loswerden. Irgendeine Idee, wie ich das beheben kann?Extra Rand in Leinwand

-Code

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

Quelle

2017-06-04 Anters Bear

Wie @Katherine Huang sagte, Browser Standard-Stylesheets, die Margen sind, Polsterung ...

du einstellen:

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

Jetzt werden Sie bestimmte Margen und Polsterungen auf jeden Satz müssen neues Element innerhalb des Körpers, becouse standardmäßig 0.

Quelle

2017-06-04 14:11:54 Jancker

Browser haben Standard-Stylesheets, die Ränder, Polsterung, und vieles mehr. Versuchen Sie Folgendes:

body { 
    padding: 0; 
}

Im Allgemeinen sind CSS-Zurücksetzungen nützlich, wenn Standardstile überschrieben werden.

Quelle

2017-06-04 13:54:56

Scheint leider nicht zu arbeiten :( –

Wie ist '* {padding: 0; Rand: 0;}'? '*' ist der universelle Selektor , so werden das Padding und die Ränder für alle Elemente auf 0 gesetzt ts. –

Extra Rand in Leinwand

Antwort

Verwandte Themen