const setRemUnit = () => {
const docEl = document.documentElement;
// IPhone6下750像素来设计,实际像素375px,1rem为50px
const rem = docEl.clientWidth / 7.5;
docEl.style.fontSize = `${rem}px`;
};
const pageShowCallback = (e) => {
if (e.persisted) {
setRemUnit();
}
};
document.addEventListener('DOMContentLoaded', setRemUnit, false);
// reset rem unit on page resize
window.addEventListener('resize', setRemUnit, false);
// reset rem unit on page show
window.addEventListener('pageshow', pageShowCallback, false);
export default setRemUnit;
 

直接引入main.js里面就好了

 大神们。如果有更好的方法,欢迎指导
 
 

vue移动端字体大小设置的更多相关文章

  1. eclipse护眼颜色和字体大小设置

    ♣eclipse护眼颜色和关键字颜色设置 ♣eclipse字体大小设置(包括jsp , .xml ,.java) 1.Eclipse字体大小调整: 窗口(Window)-首选项(Preferences ...

  2. eclipse中的字体大小设置和背景色设置

    1.字体大小设置 在basic下选择最后一个TextFont 护眼背景色设置 添加到自定义颜色后点确定 最后一步点apply

  3. hotcss.js Flexible 移动端适配在dpr=2和dpr=3出现的字体大小设置不正确问题.

    这段时间一直在用hotcss做移动端适配,做了几个页面没有发现什么问题,后来老大要加快进度,我把项目分出一块给另一个同事做,她发现了一个问题就是字体在dpr=2,dpr=3,的设备上字体大小显示老是不 ...

  4. fontresize 移动端的手机字体 大小设置

    这段js 需要置于页面上端 也就是 需要先加载js然后加载页面 (这段js是原生js而且比较短小 基本对页面加载速度无影响) FontResize : function(maxWidth){ (fun ...

  5. html5移动端页面分辨率设置及相应字体大小设置的靠谱使用方式

    对于html5移动端网页编写CSS网上有很多介绍的文章,但在实际使用过程中还是会纠结. 网上的资料太多,且大多都是技术介绍型,特别是针对android上,网上写的各种麻烦,各种复杂,各种不接地气儿.. ...

  6. vue中利用scss实现整体换肤和字体大小设置

    一.前言 利用Sass预处理实现换肤和字体大小调整. 思路及达到的效果:字体大小的适配使用window.devicePixelRatio的值和需要调整的差量进行控制.页面初始化是的字体适配可以根据de ...

  7. Eclipse字体大小设置

    打开Eclipse,在主界面下Window->Preferences->General->Appearance->Colors and Fonts, 然后在右边展开框Basic ...

  8. CSS字体大小设置时的参考(转)

    from:http://blog.sina.com.cn/s/blog_51cd580b0100gg6y.html font-size 设置的绝对关键字: 以下几个绝对字体大小的设置是有效的.当然他们 ...

  9. css字体大小设置em与rem的区别

    em 单位em是相对于父元素的,如果父元素没有设置字体大小,那就会追溯到body. 比如  如果我在box_text的父元素box加了一个字体大小   那么body的8px就会被box_text的父元 ...

随机推荐

  1. 利用VLC解码youtube视频链接

    一.需求 现在有youtube视频播放链接(I),需要得到可以直接播放的视频链接(O). 输入链接(I): https://www.youtube.com/watch?v=xAsjRRMMg_Q 输出 ...

  2. 奇点云数据中台技术汇(三)| DataSimba系列之计算引擎篇

    随着移动互联网.云计算.物联网和大数据技术的广泛应用,现代社会已经迈入全新的大数据时代.数据的爆炸式增长以及价值的扩大化,将对企业未来的发展产生深远的影响,数据将成为企业的核心资产.如何处理大数据,挖 ...

  3. [LC] 76. Minimum Window Substring

    Given a string S and a string T, find the minimum window in S which will contain all the characters ...

  4. 吴裕雄--天生自然python学习笔记:pandas模块读取 Data Frame 数据

    读取行数据 读取一个列数据的语法为: 例如,读取所有学生自然科目的成绩 : import pandas as pd datas = [[65,92,78,83,70], [90,72,76,93,56 ...

  5. 3dmax2015卸载/安装失败/如何彻底卸载清除干净3dmax2015注册表和文件的方法

    3dmax2015提示安装未完成,某些产品无法安装该怎样解决呢?一些朋友在win7或者win10系统下安装3dmax2015失败提示3dmax2015安装未完成,某些产品无法安装,也有时候想重新安装3 ...

  6. JDK源码看Java域名解析

    前言 在互联网中通信需要借助 IP 地址来定位到主机,而 IP 地址由很多数字组成,对于人类来说记住某些组合数字很困难,于是,为了方便大家记住某地址而引入主机名和域名. 早期的网络中的机器数量很少,能 ...

  7. 【待填坑】LG_2467_[SDOI2010]地精部落

    不错的dp题...思维难度和码量成反比...

  8. 求最长公共子序列-DP问题

    Longest common subsequence problem The longest common subsequence (LCS) problem is the problem of fi ...

  9. Java volatile修饰字段

     一.关键字volatile修饰字段: 使用特殊域变量(volatile)实现线程同步 volatile:不稳定的:反复无常的:易挥发的: 1.volatile关键字为域变量的访问提供了一种免锁机制, ...

  10. 批量修改datafram中某一列

    如要对df中列名为“values”的值做修改,大于等于50改为1,小于50改为0,可用apply函数来实现: def fun(x): if x >= 50: return 1 else: ret ...