1px设计图与实际效果对比

1px插件概述

1px是一款可以帮助用户观察设计图与网页最终效果的偏差的谷歌浏览器插件，用户在Chrome中安装了1px插件以后，就可以在使用1px插件打开网页的最终效果页面以后，点击添加设计图，并把设计图插入到当前的网页中与网页效果进行对比。用户可以通过鼠标点击1px添加到网页中的半透明地的设计图，与网页的原图进行重合对比，进而观察出网页的设计是否合理。

1px的使用方法

1.使用Chrome打开需要观察的效果图网页，再点击Chrome右上角的1px按钮，在1px插件弹出的窗口中点击添加按钮，并选择本地计算机中的图片添加到预览图中，如图所示：

2.用户在鼠标悬浮在预览图上面的设计图上的时候，就会出现插入和删除的按钮，如果点击插入按钮，就可以把当前的设计图添加到网页中。

3.用户添加设计图到当前网页的时候，会以半透明的方式显示到当前网页中的，用户可以通过使用鼠标拖动该设计图与网页的最终效果相比较（由于该设计图没有边框，还是半透明的状态，所以很容易看出设计图与最终效果的差别）。

1px插件的注意事项

1.因为Chrome的安全策略，用户只能对网络URL（或者本地IIS等服务器产生的URL）进行与设计图对比，对比本地计算机中的HTML文件无法进行比较。

2.1px只会帮助用户对网页中的显示效果，并不会对用户的其他操作进行判断和干扰。

插件下载地址：

此处内容已经被作者无情的隐藏，请输入验证码查看内容：

验证码：

请关注本站公众号回复“验证码”，获取验证码。 【注】”在微信里搜索“不会笑青年”或者“laughyouth”或者微信扫描右侧二维码都可以关注微信公众号。