export default function () {
let html = document.documentElement;
function onWindowResize() {
if (html.getBoundingClientRect().width < 750) {
html.style.fontSize = html.getBoundingClientRect().width / 10 + "px";
} else {
html.style.fontSize = 75 + "px";
}
}
onWindowResize();
window.addEventListener("resize", onWindowResize);
}

引入

import rem from '所在目录/rem'

rem(); //执行

vue文件中使用

<style lang="scss">
@function px2rem($px) {
$rem: 75px;
@return ($px/$rem) + rem;
}
.box{
width:px2rem(100px);
}
</style>

自动设置 rem es模块写法的更多相关文章

  1. 漫画:深入浅出 ES 模块

    本文来自网易云社区. 本文翻译自:ES modules: A cartoon deep-dive ES 模块为 JavaScript 提供了官方标准化的模块系统.然而,这中间经历了一些时间 —— 近 ...

  2. vue-cli 2.x和3.x配置移动端适配px自动转为rem

    移动端适配一直都是个大问题,现在也出现了各种各样的解决方案,比如 rem, vw 百分比等,但是比较成熟的切比较容易编写的还是 rem,他是相对于根元素的 font-size 进行等比例计算的. 但是 ...

  3. vue换算单位px自动转换rem

    cnpm i postcss-px2rem --save cnpm install px2rem-loader --save 2.配置px2rem build目录下vue-loader.conf.js ...

  4. 【转】WPF: 自动设置Owner的ShowDialog 适用于MVVM

    原文地址:http://www.mgenware.com/blog/?p=339 WPF中的Windows的ShowDialog方法并没有提供设置Owner的参数,开发者需要在ShowDialog前设 ...

  5. PowerShell脚本自动设置安卓手机wifi代理

    在实际测试工作中,经常要将安卓手机通过wifi代理的形式连接到本机的fiddler或charles服务器代理进行抓包测试.最近一直在想,有没有什么方法可以自动设置安卓手机的wifi代理,曾经想通过修改 ...

  6. 如何将ASP.NET MVC所有参数均自动设置为默认

    今天看到CSDN上有个问题觉得有点意思:"可不可以ASP.NET MVC所有参数均自动设置为默认" public class HomeController : Controller ...

  7. 使用批处理文件,自动设置计算机IP地址

    WIN7批处理设置IP地址不成功,显示“The filename, directory name, or volume label syntax is incorrect.”错误, 解决方法:将“本地 ...

  8. 自动设置iframe大小的jQuery代码

    自动设置iframe的宽度,如何用jquery来实现呢? 代码: <iframe src="main_folder.aspx" class="global_main ...

  9. Unity3D 导入贴图、模型等资源文件时自动设置参数

    脚本继承至AssetPostprocessor, 存放在Editor目录下! using UnityEngine; using System.Collections; using UnityEdito ...

随机推荐

  1. poj_1320_Street Numbers

    A computer programmer lives in a street with houses numbered consecutively (from 1) down one side of ...

  2. JavaWeb各大组件生命周期

    JavaWeb各大组件生命周期 servlet生命周期 服务器打开:在第一次请求时实例化与初始化:然后进行服务:最后服务器关闭销毁 Cookie生命周期:存储在客户端 如果不设置过期时间,则表示这个c ...

  3. SQl 语句(常见) 新建,删除,修改表结构

    2006-6-15 15:58:25 新建表:create table [表名]([自动编号字段] int IDENTITY (1,1) PRIMARY KEY ,[字段1] nVarChar(50) ...

  4. echarts零基础快速入门

    第一步:得到这个dom对象.然后进行各种操作. var myChart = echarts.init(document.getElementById('item1')); 第二步:所有的配置项全部放在 ...

  5. c#常用数据结构解析【转载】

    引用:http://blog.csdn.net/suifcd/article/details/42869341 前言:可能去过小匹夫博客的盆油们读过这篇对于数据结构的总结,但是小匹夫当时写那篇文章的时 ...

  6. Linux段式管理与页式管理

    内存管理有2种机制:1.段式管理:2.页式管理 在80386CPU中增加了2个寄存器:1.全局性的段描述表寄存器GDTR 2.局部性的段描述表寄存器LDTR 段寄存器的高13位用于在全局或局部描述表项 ...

  7. Codeforces Round #459 (Div. 2) D. MADMAX DFS+博弈

    D. MADMAX time limit per test 1 second memory limit per test 256 megabytes input standard input outp ...

  8. python QQ邮件发送邮件

    # -*- coding: UTF-8 -*- import smtplib from email.mime.text import MIMEText from email.header import ...

  9. toolbar menu 字体颜色和大小

    Toolbar菜单中menu当中我们大多数都使用图片来按钮,可是有些时候我们也会直接使用文字,文字的颜色如何修改呢. 其实很简单,我们只要修改styles.xml文件中,添加一句 <item n ...

  10. django之python3.4及以上连接mysql的一些问题记录

    首先,祭出大杀器whl https://www.lfd.uci.edu/~gohlke/pythonlibs/#mysqlclient django1.x与django2.x 在项目的写法上有一些区别 ...