Viewport Resizer:一个测试响应式设计的小书签

Viewport Resizer 是一个测试响应式设计的小书签。你需要做的就是去到您想要测试的页面,点击小书签,然后观查他在不同屏幕尺寸的适配情况。

dabb0527-6a72-493b-a062-a067551c7471

在网页制作过程中, 我们有时需要查看页面在不同分辨率下的表现。特别是当你开发的网页符合流行的Responsive design特性时, 我们需要查看pc, tablet, mobile 等各分辨率。之前我一直是用web developer的 ‘Resize’ 功能来做这件事情的, 如下图:

image3

直到今天我发现了另外一个给力的工具 – Viewport resizer。

1. Viewport Resizer使用很简单

直接把这个按钮拖到浏览器书签栏即可

image4

2. 更多自定义尺寸

Viewport resizer自带的尺寸不一定能够满足你的需求, 所以它也可以自定义添加其他类型的屏幕尺寸, 如图:

image6

官方网站:http://lab.maltewassermann.com/viewport-resizer/

1 收藏

资源整理者简介:卢伟

设计师、极客爱好者 个人主页 · 贡献了320个资源 · 5 ·    


直接登录

推荐关注

按分类快速查找

关于资源导航
  • 伯乐在线资源导航收录优秀的工具资源。内容覆盖开发、设计、产品和管理等IT互联网行业相关的领域。目前已经收录 1439 项工具资源。
    推送伯乐头条热点内容微信号:jobbole 分享干货的技术类微信号:iProgrammer