当前位置: 首页 > news >正文

vue2项目中如何把rem设置为固定的100px

在 Vue 2 项目中,可以通过动态设置 html 元素的 font-size 来将 1rem 固定为 100px。以下是具体步骤:

在项目的入口文件 main.js 中添加以下代码,用于动态设置 htmlfont-size

// main.js
function setHtmlFontSize() {const html = document.documentElement;html.style.fontSize = '100px';
}// 初始化设置
setHtmlFontSize();// 监听窗口变化,如果需要动态调整,可以启用以下代码
// window.addEventListener('resize', setHtmlFontSize);import Vue from 'vue';
import App from './App.vue';Vue.config.productionTip = false;new Vue({render: h => h(App),
}).$mount('#app');

这样设置的好处就是做所有元素都在中心的那种网页的时候,不管怎么缩放,都能保持比例。

http://www.lryc.cn/news/505519.html

相关文章:

  • C++多线程常用方法
  • ubuntu+ros新手笔记(三):21讲没讲到的MoveIt2
  • Android Studio创建新项目并引入第三方so外部aar库驱动NFC读写器读写IC卡
  • window QT/C++ 与 lua交互(mingw + lua + LuaBridge + luasocket)
  • 中阳科技:量化模型驱动的智能交易革命
  • 电子应用设计方案-56:智能书柜系统方案设计
  • 宠物兔需要洗澡吗?
  • ubuntu升级python版本
  • 《Time Ghost》的制作:使用 DOTS ECS 制作更为复杂的大型环境
  • 详细描述一下 Elasticsearch 更新和删除文档的过程。
  • OpenCV与Qt5开发卡尺找圆工具
  • 【网络安全】Web Timing 和竞争条件攻击:揭开隐藏的攻击面
  • 分立器件---运算放大器关键参数
  • Stable Diffusion Controlnet常用控制类型解析与实战课程 4
  • Linux 本地编译安装 gcc9
  • SpringBoot 自定义事件
  • unity shader中的逐像素光源和逐顶点光源
  • MongoDB-副本集
  • 【图像处理lec7】图像恢复、去噪
  • C# 连接ClickHouse 数据库
  • 在安卓Android应用中实现二维码图像的保存与条形码文本合并
  • Vue3 重置ref或者reactive属性值
  • 深入理解STL list erase
  • 使用 Python 从 ROS Bag 中提取图像:详解与实现
  • MYSQL执行一条update语句,期间发生了什么
  • 前端性能优化思路
  • 有向图判环(leetcode207,leetcode210)
  • 概率论得学习和整理25:EXCEL 关于直方图/ 频度图 /hist图的细节,2种做hist图的方法
  • PHP8.4下webman直接使用topthink/think-orm
  • 【从零开始入门unity游戏开发之——C#篇04】栈(Stack)和堆(Heap),值类型和引用类型,以及特殊的引用类型string,垃圾回收( GC)