从网易与淘宝的font-size思考前端设计稿与工作流
从博主学习前端一路过来的经历了解到,前端移动开发是大部分从PC端转战移动端的小伙伴都非常头疼的一个问题,这边博主就根据一篇自己看过的移动开发文章来剖析一下网易和淘宝的rem解决方案,希望能够帮助到一些从PC端转战web移动开发的小伙伴,因为是第一次写博文,写得不好的地方也希望大家多多包涵啦(*^__^*) 嘻嘻……(ps:文章有点长,如果你现在时间紧迫,那可以先收藏,等到有时间了再回头慢慢品尝喔) 首先我们一起看看这篇打通博主web移动开发任督二脉的武功秘籍吧( 以下内容到分割线前是引用前端大牛的文章,方便大家理解博主内容 ): 从网易与淘宝的font-size思考前端设计稿与工作流 1. 简单问题简单解决 我觉得有些 web app并一定很复杂,比如拉勾网,你看看它的页面在iphone4,iphone6,ipad下的样子就知道了: 它的页面有一个特点,就是: 顶部与底部的bar不管分辨率怎么变,它的高度和位置都不变 中间每条招聘信息不管分辨率怎么变,招聘公司的图标等信息都位于条目的左边,薪资都位于右边 这种app是一种典型的弹性布局:关键元素高宽和位置都不变,只有容器元素在做伸缩变换。对于这类app,记住一个开发原则就好:文字流式,控件弹性,图片等比缩放。以图描述: 这个规则是一套基本的适配规则,对于这种简单app来说已经足够,同时它也是后面要说的rem布局的基础