超实用！写给设计师的移动页面适配小知识

如果按照 640 宽度进行设计，实际上我们潜在约定了这是个类似 iPhone4/4S 的 2 倍像素比的设计稿。那么，无论采用何种适配方案，我们输出的 icon 等都是 相当于两倍尺寸的。而在前端开发过程中，如果采用 meta 方案，则 CSS 中使用实际尺寸。

而如果是百分比方案等，则在样式中设置设计稿 1/2 的尺寸(对应设备的物理像素)，但 icon 图片本身还是设计稿的尺寸，只是在 Retina 屏幕上需要更多的像素，所以用代码将其展示时在设备上的物理尺寸压缩到了 1/2。

关于物理像素，CSS像素，像素密度等内容，足够再写上 10086 个字了。作为设计师，只 需要知道大概的计算方式，以及基本的适配方案 就可以了。

最后，也是最重要的，你的团队一定要有 设计规范，并且有与之对应的 开发规范，这样才能真正的实现无缝对接。

欢迎关注作者微信公众号：

注：相关网站建设技巧阅读请移步到建站教程频道。

（编辑：宁德站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!