sdc-alibaba / SUI-Mobile

SUI Mobile (MSUI)是由阿里巴巴国际UED前端出品的移动端UI库,轻量精美
http://m.sui.taobao.org/components/
MIT License
6.11k stars 1.58k forks source link

rem计算 #602

Open ghost opened 8 years ago

ghost commented 8 years ago

引入zepto.min.js和sm.min.js之后 图片大小为110 * 110的。如何换算成rem哈 在 iphone6 上使用 1rem = 20px 来换算。 是像我这样计算吗110px/20 = 5.5rem;(这样得到的结果适配结构有些大特别在5上)

之前用的flexible.js换算的是 110/75 = 1.4667rem;

xyqfer commented 8 years ago

SUIiPhone6 (375px)及以下是按照 20px 来算的,在 iPhone5 上确实显大,可以考虑自行去修改 rem.less 源码:

@baseWidth: 375px;
@baseFont: 20px;

html {
  font-size: @baseFont;
}

@bps: 320px, 360px, 375px, 384px, 400px, 414px, 480px;

.loop(@i: 1) when (@i <= length(@bps)) {  //注意less数组是从1开始的
  @bp: extract(@bps, @i);
  @font: @bp/@baseWidth*@baseFont;  
  @media only screen and (min-width: @bp){
    html {
      font-size: @font !important;
    }
  }
  .loop((@i + 1));
};
.loop;