用JS設置元素寬度超過html innerWidth

在使用window.innerWidth和window.innerHeight選擇畫布寬度和高度時，應設置畫布寬度和高度以適應不包括工具欄和所有內容的屏幕，但不知何故，它超出html高度和寬度。用JS設置元素寬度超過html innerWidth

<style> 
    body, html { 
     margin: 0; 
     padding: 0; 
    } 


</style>  

<body> 
<canvas id="myCanvas"></canvas> 
<script> 
    var myCanvas = document.getElementById("myCanvas"); 
    var c = myCanvas.getContext("2d"); 
    myCanvas.width = window.innerWidth; 
    myCanvas.height = window.innerHeight; 
    myCanvas.style.backgroundColor = "#000000"; 
</script> 
</body>

我該如何解決這個問題？我看過其他樣本，它們完全一樣，但這不適用於我的代碼。

來源

2017-08-30 tankit88

我有這個issue，這是因爲畫布是一個內聯元素。

爲了它，所以它不是一個內聯元素把它變成一個塊級元素，像這樣：

canvas { 
    display: block; 
}

來源

2017-08-30 05:06:33

它的工作，我覺得有一些問題與innerWidth或innerHeight不取的數字正確，非常感謝您修理我的草坪：P – tankit88

用JS設置元素寬度超過html innerWidth

回答

相關問題