rem
2019-05-31 本文已影响0人
撕心裂肺1232
rem相对单位:
rem是 CSS3 新增的一个相对单位(root em),即相对 HTML 根元素的字体大小的值。
em 相对单位,也是一个相对单位,却是相对于当前对象内文本的字体大小。
一般建议在 line-height 使用 em。因为在需要调整字体大小的时候,只需修改 font-size 的值,而 line-height 已经设置成了相对行高了。
css:
html,body{
font-size: 100
}
js:
function changFontSize(){
var window_width=$(window).width();
var fontSize=(window_width/1920)*100;
$('.z_page').css('font-size',fontSize+'px');
}
网上参考版本:
https://qishaoxuan.github.io/css_tricks/
(function (doc, win) {
var docEl = doc.documentElement
var resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize'
function recalc() {
var designWidth = 750
var clientWidth = docEl.clientWidth
if (!clientWidth || clientWidth > designWidth) return
docEl.style.fontSize = (100 * clientWidth / designWidth) + 'px'
}
if (!doc.addEventListener) return
win.addEventListener(resizeEvt, recalc, false)
doc.addEventListener('DOMContentLoaded', recalc, false)
})(document, window)