快捷方便的调试微信公众号内的H5网页

还记得在写iOS苹果设备的App时，程序有两种测试方法，一种模拟器测试，一种真机测试。我们可以不用上线，通过断点和测试单元，配合模拟器或者真机，就可以很方便的知道我们写的App的成效，已经出现的状况，这也是书写原生应用的好处。

 在这里想要书写H5，然后观察H5在手机上呈现的状态，我们可以进行如下的操作：

1.在浏览器的网站中（推荐使用Google，Firefox，搜狗似乎也是可以使用的），首先在浏览器中打开网址，然后按下键盘最上排的F12。

出现的是我们常见的Web网站的调试方法。

通过html下的Emulation，找到设备Device，选择自己需要的设备。

当然这一一切的前提都必须是你书写的网页是响应式的布局，并且是需要标注一个手机网页。

    <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
这里参数的含义分别是：

width-viewport的宽度
height-viewport的高度 
initial-scale 初始的缩放比例 
minimum-scale 允许用户缩放到的最小比例 
maximum-scale 允许用户缩放到的最大比例 
user-scalable 用户是否可以手动缩放

2.当微信公众号中我们书写的内容显示的不正确，但是我们又无法像网站一样，按下F12，就能看到效果。

微信web开发者工具解决了这些问题。下面的链接是微信开发者平台的开发者文档，在这里面，我们可以知道成为Web开发者的整个流程，我就不在这里一一赘述。按照下面的文档的步骤，我们可以很快速进行微信网页的调试。

http://mp.weixin.qq.com/wiki/10/e5f772f4521da17fa0d7304f68b97d7e.html#

步骤方法十分的简单易懂。