基於rem的螢幕適配方案

admin發表於2017-02-23
REM

程式碼例項如下:

[JavaScript] 純文字檢視 複製程式碼
function resizeHtmlFont() {
  var hW = $("html").width();
  $("body,html").attr("style", "font-size:" + hW / 16 + "px !important;");
}
$(document).resize(function() {
  resizeHtmlFont();
});
addEventListener("orientationchange", function(e) {
  e.preventDefault();
});
resizeHtmlFont();

主要思路是根據瀏覽器寬度動態設定跟元素的字號，然後全部頁面元素都使用rem進行佈局，即可實現根據不同螢幕寬度進行適配。


相關文章