本文已参与「新人创作礼」活动，一起开启掘金创作之路。

需求：动态改变html的font-size，px随浏览器大小改变，话不多说上代码。

App.vue中：

resizeFun() {
            let docEle = document.documentElement,
                resizeEvt =
                    'orientationchange' in window ? 'orientationchange' : 'resize',
                resizeFun = () => {
                    let clientWidth = docEle.clientWidth;
                    if (!clientWidth) return;
                    docEle.style.fontSize = 100 * (clientWidth / 1920) + 'px';
                };
            if (!document.addEventListener) return;
            window.addEventListener(resizeEvt, resizeFun, false);
            window.addEventListener('DOMContentLoaded', resizeFun, false);
            resizeFun();
        },

然后在生命周期中调用this.resizeFun()即可.

总结：

• 1.如果想根据分辨率使用自适应，用rem作为单位。 如：1920分辨率20px,改成0.2rem。计算公式1rem=100px
• 2.如果有些地方不需要自适应，还是继续用px作为单位