当前位置:学者斋 >

设计制作 >网页设计 >

如何快速测试响应式网页设计的Chrome扩展

如何快速测试响应式网页设计的Chrome扩展

测试响应式的网站可以有很多方式,下面为大家分享的是使用 Chrome 扩展版的 RWD 测试工具“Responsive Web Design Tester”测试效果也不错哦,下面来看看介绍。

如何快速测试响应式网页设计的Chrome扩展

  使用教程

下载 “Responsive Web Design Tester”Chrome 扩展,安装后,浏览器右上角会多出一个扩展图标,点击他就可以设置当前网站用什么样的设备来展示了,如下图:

  新增设备

此扩展默认有流行的移动设备,Apple、Android、平板等等已经很齐全了,然而你若想添加其它,可以通过设置该扩展了添加,并且支持添加用户代理(User-Agent)。

  Step 1: 右击扩展图标,在弹出的菜单选择“选项”即要调出设置界面:

  Step 2: 点击“New Device”按钮,并设置对应的名称分辨率即可。

对于不懂添加User Agent 的可以随机添加,或复制其它选项的`,又或者查看 User Agent List 这个列表来添加对应的用户代理。

  RWD Tester Chrome 扩展特色

简洁的新窗口形式展示网页(无URL 地址栏、书签栏等干扰)

方便快捷的查看方式(直接在浏览器右上角图标选择查看,也支持鼠标右键)

可自定义分辨率

  • 文章版权属于文章作者所有,转载请注明 https://xuezhezhai.com/sjzz/sjzz/1964e.html