移动端适配

px才是最佳适配单位，很简单 随便去打开几个顶级网站 比如油管 谷歌 推特 谁用vs vh做适配？ 最标准的做法是 文字大小用em rem px 除文字外 其他容器尺寸 元素尺寸全部用px

up的意思是把设计稿标注的px转成vh vw，这种单位转换是错误的 导致的问题我就不展开讲了，另外自适应也不是用px 而是用弹性布局+媒体查询

这个其实也是传统教学的误区，在国外根本就没有响应式和自适应这两个词，本身就只有一个单词叫"responsive" 早些年国内人翻译它出现两个版本也就是“自适应”“响应式” 其实都是一个意思，原意就是基于弹性布局+媒体查询的responsive，如果你们去问那些教你们用vw vh做自适应的老师为什么用这两个 他们也说不出来原因 因为他们也是被早些年那波传统教学这么教的，b站和淘系都是比较老的站点了，都是那波人搞的hack手段，是非主流的方法

前端经常容易犯的一个形而上学的错误就是 会以为等比缩放就叫适配 即看到设计稿长这样 那我也希望它在任何屏幕下也维持同样的比例，所以才会有各种用% vh vw rem这种单位来做适配的 这是错误的，为什么？想一想，如果所有页面都只是根据屏幕等比缩放 虽然维持了统一的显示比例，但无论我屏幕多大，它所呈现的内容都和小屏一样多，那我还要大屏有啥意义呢？简言之， 我用iphone 4和32寸显示器看到的内容是一样多 只是32寸的字超级大罢了，那这种做法显然不对。行业里开发者是怎么解决的？答案是不解决！厂商已经自动帮我们解决了，举个例子，你在1080p 24寸显示器上打开14px的文字 和手机上打开14px文字，你会发现 他们的实际肉眼大小差别不大 属于同一量级 但他们的分辨率却差了2倍 ppi更是差了4倍 为什么能维持同样大小？因为人们看显示器并不希望文字等比缩放到超级大 而是一个合适的大小 呈现更多的画面 这才是大屏存在的意义啊。所以操作系统会自动对屏幕的ppi进行适配 比如你接上不同的显示器 window显示器设置里会有一个自动帮你设好的缩放比例，1080p默认是100% 2k是150-200% 这是所谓的1x 2x 3x图的概念，同样在mac端显示器设置里也有一个缩放比例 默认是”合适“ 它自动帮你算好了。总之 开发者要做的事情就是什么都不做，就按1x图的设计稿的px单位去开发1x界面，它会在操作系统的加持下 自动适配任何高低分辨率 大小屏幕尺寸 自动做到肉眼尺寸合适 显示面积合适的程度。

h5当中一样不能用等比缩放，你打开任何一个app 在iPhone 6和6plus上 它都不是等比缩放，用户买大屏的目的不是因为近视眼看不清字 而是希望能看到更多的内容，当然实际同为14px在plus上 系统会自动渲染为略大于小屏手机的尺寸 这就同时满足了可视内容增多+单位放大，前端开发的目的不是为了还原设计稿 而是用户体验，ui设计没办法通过一张静态设计稿告诉你如何自适应 但不意味着前端就可以偷懒直接用等比放大来完成KPI

以上内容来自于评论 @谦谦前端