为了更方便的模式手机查看网页显示的样式,Chrome网页浏览器给我们提供了非常实用的解决方案工具。

以前我们介绍过如何通过修改Chrome浏览器运行参数的方法来模拟手机访问网站,但是在Chrome 32和33版本以后增加了更加便捷的方法,在开发者工具中只需要设置一下就能方便的模拟各种手机型号的访问效果。

 

方法如下:

1、打开Chrome浏览器,需要32以后版本的,笔者使用的是Chrome Version 39.0.2171.95 (64-bit) 版本。

2、打开"设置" ——》 "工具" ——》 "开发者工具",或快捷键(F12或者Ctrl+Shift+i)

analog-cell-phones-chrome-browser-01

 

3、在“开发者工具”界面的右侧有个“Show drawer”按钮(鼠标悬浮在其上面才可见),点击后在“drawer”界面再点击“Emulation”,如下图:

analog-cell-phones-chrome-browser-02

 

4、上图界面就一目了然了,Device里面可以选择各种手机或者平板设备,大概有20种之多。User Agent和Sensors显示了模拟的数据。

analog-cell-phones-chrome-browser-03

 

5、然后就在地址栏里面输入网址吧!看看模拟的效果怎么样?

 

-------

老版本Chrome模拟手机显示方法

谷歌Chrome浏览器,可以很方便地用来当3G手机模拟器。

在Windows的【开始】-->【运行】中输入以下命令,启动谷歌浏览器,即可模拟相应手机的浏览器去访问3G手机网页:

谷歌Android

chrome.exe --user-agent="Mozilla/5.0 (Linux; U; Android 2.2; en-us; Nexus One Build/FRF91) AppleWebKit/533.1 (KHTML, like Gecko) Version/4.0 Mobile Safari/533.1"

 

苹果iPhone 4

chrome.exe --user-agent="Mozilla/5.0 (iPhone; CPU iPhone OS 5_0_1 like Mac OS X) AppleWebKit/534.46 (KHTML, like Gecko) Mobile/9A405"

 

苹果iPad 2

chrome.exe --user-agent="Mozilla/5.0 (iPad; CPU OS 5_0_1 like Mac OS X) AppleWebKit/534.46 (KHTML, like Gecko) Mobile/9A405"

 

诺基亚N97

chrome.exe --user-agent="Mozilla/5.0 (SymbianOS/9.4; Series60/5.0 NokiaN97-1/20.0.019; Profile/MIDP-2.1 Configuration/CLDC-1.1) AppleWebKit/525 (KHTML, like Gecko) BrowserNG/7.1.18124"