自适应网页是HTML5设计的最大特色之一，也就是可以按照用户所使用的设备的分辨率，窗口尺寸等信息，自动选择显示效果最佳的版面来显示。为了达到选择最佳版面显示效果，就需要先检测当前的屏幕信息再来进行判断与调整。
{screen.height/screen.width}
此属性可以检测当前设备所使用的分辨率，在计算机中的分辨率信息可以在”桌面“上的单击鼠标右键，通过”屏幕分辨率“来查询。
{clientHeight/clientWidth}
此属性可以查询整个浏览器窗口的长度尺寸，数值范围包括整个浏览器窗口，此数值会随着浏览窗口的缩放而改变。
{availHeight/availWidth}
此属性可以查询浏览器的可用尺寸，数值的范围仅有”显示内容“的部分，也就是网址栏，网页标签都不计算在内。此数值将计算浏览器最大化时可用的尺寸，不会因为浏览器页面的缩放而改变。
检测当前浏览器页面的高度：document.documentElement.clientHeight 检测当前浏览器页面的宽度：document.documentElement.clientWidth
检测屏幕分辨率的高度：screen.height
检测屏幕分辨率的宽度：screen.width
检测浏览器最大可用范围的高度：screen.availHeight
检测浏览器最大可用范围的宽度：screen.availWidth
在HTML5游戏开发中检测屏幕分辨率与尺寸的目的，最主要就是为了检测当前玩家使用电脑网页方式还是用手机来启动游戏，而后就是选择最合适的版面来显示游戏画面。
这里提供了自动转换电脑版与移动版面供大家参考，首先使用screen.availWidth来获取浏览器的可用宽度，由于一般手机屏幕的尺寸是320X480，所以使用if判断语句判断：
如果浏览器宽度小于321，这代表当前设备是手机，那就调用手机版的设置；否则就调用电脑版的设置。
【（15）HTML5-分辨率检测】
推荐阅读
- JavaScript|JavaScript之DOM增删改查(重点)
- html5|各行业工资单出炉 IT类连续多年霸占“榜首”位置
- Shopify如何选品中文教程 – 评估所选品的产品和利基市场的准则上
- Shopify如何选品中文教程 – 评估所选品的产品和利基市场的准则下
- webpack配置|基于webpack3.x的多页面配置（HtmlWebpackPlugin学习篇二 ——动态配置）
- Shopify如何选品中文教程 – 最后一课
- &#x(unicode编码后的汉字)JS转换方法
- 微信小程序页面性能|如何解决微信小程序加载慢的问题（）
- WEB前端|用HTML5canvas绘制一个圆环形的进度表示