响应式的网站的好处是在不同屏幕的平台均可以访问,现在的网站大多数都是响应式的,这样不用再为移动端单独开发样式了。响应式网站我们也得在电脑平台开发,电脑端调试样式很方便,开发者使用的浏览器都会支持查看元素功能,通过这个功能可以很容易调试网站样式并可以看到效果。一般情况手机界面我们可以缩小屏幕宽度来实现,或者通过浏览器的响应式设计模式进行调试。
不过有些情况是这样的,我们在网站中通过一些判断设备的代码,使得某些显示在手机和电脑设备显示不同,比如加入广告,像百度广告并不支持响应式,而是手机广告和pc广告分离的,需要个字单独添加,我们就得用一下判断代码来。
之前想着,如果手机浏览器也有想pc啥时给你查看元素那样的功能,那就可以方便多了,可是发现并没有这样的浏览器,唯有个别浏览器支持查看网页代码功能,但是看到的只是纯代码。
在使用火狐手机浏览器时,发现有远程调试功能,试了之后,发现这是站长们的福利呀。这功能可以通过pc调试手机上的网站。
火狐也有介绍,硬是以前没找到:Debugging Firefox for Android with WebIDE
使用条件:
一台运行着至少Firefox36或更新版本浏览器的桌面计算机或笔记本电脑
一台 支持运行 Firefox for Android 的安卓设备,并且安装运行了 Firefox for Android 35 或更高版本
两台设备使用USB连接起来
pc 版浏览器安装ADB Helper组件
这三个条件具备后就可以轻松调试了
首先开启手机版浏览器远程调试功能:设置==》开发者工具==》勾选通过USB远程调试
手机版这就设置好了,
电脑安装好ADB Helper组件后,按Shift+F8(或者点菜单==》开发者==》WebIDE),打开WebIDE后,通过usb链接手机和电脑,当然得开启手机的开发者模式和允许usb调试功能。链接后提示允许USB调试?确定。这样才能调试到火狐浏览器。下来火狐浏览器弹出:入站连接,选择允许。下来就连接上了
和调试pc网页一样,电脑调试,手机可以看到调试效果