和sui、light7有一些淵源，項目使用的是light7，不過其他兩者的文檔也都看了，感覺不到大的差別。

//
// Rem
// --------------------------------------------------

// Vertical screen

//375屏幕為 20px，以此為基礎計算出每一種寬度的字體大小
//375以下不變，375以上等比放大

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

html {
  font-size: @baseFont;  //默認當做320px寬度的屏幕來處理
}

body {
  font-size: 16px;
}

@bps: 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;

1.默認的是豎屏情況下的展示。隱約的表明我們要自己禁止橫屏或是自己做橫屏適應。我的做法是用戶橫屏時直接出彈框提示。

2.以375px寬設備的邏輯像素為基準---20px=1rem，計算公式為 x/20=width/375；其中width為設備的邏輯像素，反計算出新的rem基準值。賦值給html。sui，light7，和jquery--weui只給常見的375,414等添加了判斷。安卓設備邏輯像素大多是360px，不在判斷範圍內，直接設置成16px了，沒有套用計算公式。

3.像是padding，margin，font-size等盡量換算成rem，自適應屏幕。

讀jquery-weui的rem.less