畫布沒有正確IE10與最大寬度顯示：100％

Question

CSS：

canvas { 
    max-width: 100%; 
    } 

HTML：

<canvas id="Spades" width="240" height="320" style="background-color:white;border-radius:10px"> 

上面的CSS不IE10工作，高度被替換爲寬度我提供。 任何幫助is appricited

Answer 1

你試圖調整大小的畫布到整頁大小？

您的最大寬度僅用於定義畫布的理論最大寬度，不會導致畫布被調整大小。

反正...

不要使用CSS來調整畫布，因爲你的畫布圖紙會被扭曲。這是因爲瀏覽器通過「伸展」現有畫布像素來調整CSS大小。

取而代之的是，通過設置canvas元素本身的寬度來調整javascript的大小。

var canvas = document.getElementById('myCanvas'), 
canvas.width = window.innerWidth; 
canvas.height = window.innerHeight;