项目中使用rem的方法

首先建立一个js文件
@/utils/rem

window.onload = function() {

    setRem();

};

window.onreset = function() {

    setRem();

};

/* 设置字体rem */

function setRem() {

    var width = document.body.offsetWidth; // 获取当前页面的宽度

    var nowFont = width / 375 * 37.5; // 通过标签名称来获取元素 

    var htmlFont = document.getElementsByTagName('html')[0]; // 给获取到的元素的字体大小赋值

    htmlFont.style.fontSize = nowFont + "px";

}

在main.js里面引入该文件

import rem from './utils/rem.js'
Vue.use(rem)

之后在页面中就可以使用rem来设置字体的大小了,特别针对移动端的(形式基本相同)。
注:在uni-app开发过程中使用这个,运行不出来,不知道是个人技术原因还是uni-app本身就不适用这个

每次的困难,都是蜕变的开始

posted @   seekHelp  阅读(435)  评论(0编辑  收藏  举报
编辑推荐:
· AI与.NET技术实操系列:基于图像分类模型对图像进行分类
· go语言实现终端里的倒计时
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热?
阅读排行:
· 25岁的心里话
· 闲置电脑爆改个人服务器(超详细) #公网映射 #Vmware虚拟网络编辑器
· 基于 Docker 搭建 FRP 内网穿透开源项目(很简单哒)
· 零经验选手,Compose 一天开发一款小游戏!
· 一起来玩mcp_server_sqlite,让AI帮你做增删改查!!
点击右上角即可分享
微信分享提示