1喧枷,通過js來改變html的根目錄字體大小來動態(tài)改變界面的字體大小來自適應(yīng),
2弓坞,最好放在全局變量里面隧甚,讓整個頁面都共用,
3渡冻,每個盒子里面要設(shè)置字體大小不然變大屏幕字體會看不見戚扳,
原生js代碼
其中document.addEventListener("touchstart", function() {},false);是為了偽類兼容ios
/* * rem適配函數(shù) * html 內(nèi)容 * width 瀏覽器寬度 * */ function rem(){ var html = document.documentElement; var width = html.getBoundingClientRect().width; html.setAttribute('style','font-size: ' + width/15 + 'px !important;'); } /* 頁面加載完成觸發(fā) */ window.onload = function(){ rem(); } /* 窗口大小發(fā)生改變時觸發(fā) */ window.onresize = function(){ rem(); } /*兼容ios a標(biāo)簽的偽類*/ document.addEventListener("touchstart", function() {},false);
jquery代碼
var oWidth;
function pm(){
? oWidth = $(window).width();
$('html').css('font-size',oWidth/15);
}
pm();
$(window).resize(function(){
pm();
});
document.addEventListener("touchstart", function() {},false);