html5手机自适应代码
本来想使用HTML5的canvas做一个手机小游戏，结果第一步canvas自适应屏幕大小就卡住了：
- <span style="font-size:14px;"><span style="white-space:pre"> </span><span style="white-space:pre"> </span><body style="height: 100%;background-color: blue;">
- <canvas id="gameCanvas" style=" height: 100%;background-color: red;">
- 您的浏览器不支持HTML5 canvas，请换一个浏览器。
- </canvas></span>
本来这段代码也是从网上视频搞到的，但是我发现可能这段代码对于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自适应屏幕大小的问题：
<body style="height: 100%;width: 100%;margin: 0;padding: 0;">
<canvas id="gameCanvas" style=" height: 100%;width: 100%;margin: 0;padding: 0;display: block;">
您的浏览器不支持HTML5 canvas，请换一个浏览器。
</canvas>
