Responsive Viewer - 响应式布局测试工具

Responsive Viewer插件是一款响应式网页查看工具,它可以展示你的网页在多个尺寸屏幕下的样式,并将所有的屏幕在一个页面上展示,你可以快速查看网页的响应式设计

概述

在一个视图中显示多个屏幕的 Chrome 扩展程序。该扩展将帮助前端开发人员在开发响应式网站/应用程序时测试多个屏幕。
Dima Hamayunau (https://dribbble.com/abybe) 的图标。
在这里你可以看到Responsive Viewer在各种设备上的表现,默认的有iPhone、Galaxy、Pixel等多种型号的设备,还可以查看中等和大屏幕下的表现
你要兼容特定的设备,还可以添加设备,可以自定义尺寸和User Agent,双击对应的设备还可以删除或修改其参数
该工具还提供了一些选项,比如你可以根据自己的需求,调整设备顺序,将比较重要的设备拖拽到上方,方便查看,对于不需要适配的屏幕,还可以将其隐藏
还可以调整查看模式,纵向还是横向,进行翻转屏幕等操作,让你的响应式设计工作更简单
Responsive Viewer - 响应式布局测试工具插图

隐私说明

该扩展程序不会跟踪或收集您的任何数据,甚至没有连接到任何服务器来存储数据。

插件安装说明

1、在打开的谷歌浏览器的扩展管理器
就是点击最左侧的三个点,在弹出的菜单中选择【更多工具】——【扩展程序】
或者你可以在地址栏中直接输入chrome://extensions/
a 2、进入扩展程序页面后将开发者模式打勾
3、最后将解压出来的crx文件拖入到浏览器中即可安装添加
4、如果出现无法添加到个人目录中的情况,可以将crx文件右键,然后选择【管理员取得所有权】,再尝试重新安装
5、安装好后即可使用

Responsive Viewer下载地址
Responsive Viewer - 响应式布局测试工具插图2
©下载资源版权归作者所有;本站所有资源均来源于网络,仅供学习使用,请支持正版!

发表评论