本來想使用HTML5的canvas做一個手機小游戲，結果第一步canvas自適應屏幕大小就卡住了：

您的瀏覽器不支持HTML5 canvas，請換一個瀏覽器。

本來這段代碼也是從網上視頻搞到的，但是我發現可能這段代碼對于PC瀏覽器自適應高度有用，但是對于手機就不行了，執行代碼效果如下：

把body背景設為藍色，canvas背景設為紅色，大家可以看到二者并未重疊，canvas左上角和body左上角不重合導致上邊和左邊留有藍色空白，而且還有滾動條，使用JS代碼獲取body的寬高度：

//獲取屏幕寬度與高度

gWinHeight = document.body.clientHeight;

gWinWidth = document.body.clientWidth;

alert(gWinWidth + "," + gWinHeight);

結果為(304， 486)，但是我的iPhone4的屏幕寬度是320，高度是460(算是狀態欄是480)，但是從計算結果來看，寬高度得到的結果明顯都不對，也不知道是怎么計算出來的。

從網上找了許多資料，一一試過后，可以使用如下辦法，解決手機APP自適應屏幕大小的問題：

您的瀏覽器不支持HTML5 canvas，請換一個瀏覽器。

總結

以上是生活随笔為你收集整理的html5设计图的状态栏标准高度,HTML5 canvas自适应手机屏幕宽高度大小的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。