移動端布局適配解決方案

2021-08-17 06:40:39 字數 633 閱讀 2733

以下這段**是用於根據移動端裝置的螢幕解析度計算出合適的根元素的大小

當裝置寬度為375(iphone6)時,根元素font-size=100px; 依次增大;

限制當為裝置寬度大於768(ipad)之後,font-size不再繼續增大 

scale 為meta viewport中的縮放大小

/**

* 設定根元素font-size

* 當裝置寬度為375(iphone6)時,根元素font-size=100px;

*/(function (doc, win)

fz = 100 * width / 375;

docel.style.fontsize = fz + 'px';

};if (!doc.addeventlistener) return;

win.addeventlistener(resizeevt, refreshrem, false);

doc.addeventlistener('domcontentloaded', refreshrem, false);

refreshrem();

})(document, window);

移動端布局解決方案

flex布局 rem 百分比 px 畫素 絕對單位 pixel pix picture el element 影象元素 百分比 相對單位 相對於父級元素 rem 相對單位 root 根元素 相對於根元素字型大小的倍數 em 相對單位 相對于父元素字型大小的倍數 vh view height 檢視高 ...

移動端布局解決方案 神器

godcss 移動端布局終極解決方案 神器 讓移動端布局開發更加容易 http www.github.com godcss 第一部分 example 所有的示例都在這個目錄下 duang normal wolf src 主要檔案在這裡 godcss.js px2rem.less px2rem.scs...

移動端布局解決方案 神器

godcss 移動端布局終極解決方案 神器 讓移動端布局開發更加容易 http www.github.com godcss 第一部分 example 所有的示例都在這個目錄下 duang normal wolf src 主要檔案在這裡 godcss.js px2rem.less px2rem.scs...