随着移动端的普及，项目也越来越多的要求适应多种设备，之前调试的时候用Chrome自带的device mode，比较方便，但是与实际在多设备上的显示还是有差别的。
Adobe Edge Inspect CC插件是由Adobe公司开发的一款查看和调试手机等移动设备的工具，可以允许用户在不安装客户端的情况下通过Chrome插件来实现（如果你使用的是Adobe Brackets coding的话，也会有专门的插件，下面会介绍），使用起来非常的方便。

下载与安装Adobe Edge Inspect CC

下载地址：https://creative.adobe.com/zh-tw/products/inspect
打开下载地址，可能会弹出让你选择国家地区，这时关闭就好（如果打开上面链接，出来的直接是Adobe中国的官网，或者国家地区选择了中国，那就清除浏览器缓存后再打开）
然后登录Adobe ID后，会自动下载CreativeCloud，安装后从CreativeCloud中下载Adobe Edge Inspect CC。
安装完毕后，点击屏幕右下角的
这里我选择测试IOS

然后会打开Adobe Edge Inspect CC的APP下载地址，http://itunes.apple.com/app/id498621426（这里从手机APP STORE搜索下载Adobe Edge Inspect CC也是可以的）。

使用Adobe Edge Inspect CC

我现在要测试手机端上的效果。
打开手机上的Edge Inspect
进行如下操作：

方式一 ：通过Chrome扩展连接

Chrome扩展连接下载：https://chrome.google.com/webstore/detail/adobe-edge-inspect-cc/ijoeapleklopieoejahbpdnhkjjgddem
如果没有翻墙可以点击下载
安装完后打开Chrome，点击右上角Adobe Edge Inspect CC扩展图标，输入之前的连接码

连接成功后，手机端就会实时显示Chrome中当前网页在手机端的效果，如下图：

方式二 ：通过Adobe Brackets插件连接

我平时是用Adobe Brackets写代码，出了Adobe Edge Inspect CC，Adobe对于自家的产品是肯定支持的。
打开Brackets的扩展管理器搜索安装Adobe Edge Inspect CC。这里安装过程就不说了。
点击Brackets右侧Adobe Edge Inspect CC插件

插件中提供，刷新、在设备上全屏显示、截图功能

注：Brackets中使用Adobe Edge Inspect CC插件，必须先打开 文件 → 项目设置，输入你本机搭建的WEB服务器地址（如http://192.168.0.102:8080）,才能在手机上看到实时效果。