设置移动端参考元素大小

sublime插件:cssrem配置


{
  "px_to_rem": 108,//设计稿按照1080p给的
  "max_rem_fraction_length": 2,
  "available_file_types": [".css", ".less", ".sass"]
}

运算规则


设计稿一般按sp给出,需要先换算成px(一般乘以3),再利用cssrem转换为rem

code


 ! function(d) {
    var c = d.document;
    var a = c.documentElement;
    var b = d.devicePixelRatio;
    var f;

function e() {
    var h = a.getBoundingClientRect().width,
        g;
    if (b === 1) {
        h = 720
    }
    g = h / 10;
    a.style.fontSize = g + "px"
}
if (b > 2) {
    b = 3
} else {
    if (b > 1) {
        b = 2
    } else {
        b = 1
    }
}
a.setAttribute("data-dpr", b);
d.addEventListener("resize", function() {
    clearTimeout(f);
    f = setTimeout(e, 200)
}, false);
e()

}(window);

你可能感兴趣的:(设置移动端参考元素大小)