css样式的单位问题

Question

老师：为什么移动端的布局样式不用rem，em单位，而是用了px

Answer 1

ustbhuangyi 2016-11-21 22:00:08

一般来说，一个项目即兼容 PC 端又兼容移动端基本算是伪需求~首先，从设计角度来看，移动端和 PC 端设计和交互差别都很大；其次如果想要 2 个端都看得过的去的话，得大量写 media query，代码很难维护；最后从功能角度，PC 浏览器，特别一些低版本 IE，很多功能没法在 2 端同时应用。所以，我们先忽略掉 2 端同时兼容的问题。

移动端也是可以用 rem 的，虽然我不喜欢用，基本 px 可以解决问题。具体 rem 的使用方式，可以网上搜索更详细的资料喔。推荐一篇 rem 的文章（http://isux.tencent.com/web-app-rem.html），虽然这里面的一些观点我不认同~

Answer 2

ustbhuangyi 2016-11-21 19:12:42

移动端 rem 在大屏手机有老年机的即视感，我不太喜欢，em 一般也需要计算，不够直观。 现在一般移动端的设计稿都是基于 iphone6 设计的，一般我们的尺寸 = 设计稿标注/2，所以用 px。 需要自适应的地方一般都可以通过 flex 布局解决~ 

• tangjkd #1

  为什么 尺寸要 = 设计稿标注/2 , 而不是 除以 3 , 或者直接按照设计稿的标注来写

• ww2013宁 回复 tangjkd #2

  因为现在大部分设计稿是以iphone6 为基准设计的2倍图啊，iphone6 的是dpr是2，所以应该除以2

• tangjkd 回复 ww2013宁 #3

  斯国一,懂了,谢谢

Answer 3

提问者 暗笛扉声 2016-11-21 21:41:58

那是不是可以这里理解：如果是纯手机端的应用，用px基本就可以解决问题。如果是需要在pc端和移动端都能展示良好的话，这时候需要rem和em了。

我如上理解是否合理？

那么什么场景应用rem比较合适？

在使用rem的场景中，怎么设置html根节点的字体大小？

期盼回复，感恩老师

• _小_七_ #1

  rem就是一个相对html根节点的单位  ，使用场景就是响应式，最重要一点就是如果有给用户自己调整字体大小的需求的话最好用rem，比如电子书阅读器这些。不过我还是用px，因为rem对我来说没什么卵用。设置很简单。html{font-size:62.5%}//这样就相当于所有字体默认10px大小了，其他div用的时候你如果想要14px大小就写font-size:1.4rem,另外chrome有字体大小限制，不能小于12px，即使你设置font-size：1rem 也不会是10px，而是12px. 我写的网站ltechlighting.com/index.html

• 提问者 暗笛扉声 回复 _小_七_ #2

  多谢分享^_^

• _小_七_ 回复 提问者 暗笛扉声 #3

  记得采纳一下 我有一分

点开查看后面1条评论

Answer 4

27网络 2017-05-04 14:05:24

看来很多人想问这个问题

Answer 5

野蛮生长的草 2017-03-03 14:54:26

开始我也一直在想这个问题，以为rem布局放在最后面讲，看了同学么的提问才知道  原来如此精彩

以前我有个设计稿是ip6的标准  但是需要兼容ip4  如按px做有出入  后面换成rem才解决