在Vue项目中,如何为页面应用rem单位并解决设置基础font-size以实现自适应的问题?
最编程
2024-02-12 09:14:21
...
1 (function(){ //适配设置基础rem
2 function w() {
3 var r = document.documentElement;
4 var a = r.getBoundingClientRect().width;//获取当前设备的宽度
5 console.log(a,'获取当前设备的宽度s');
6 if (a < 1280) { //414不固定,根据设计稿的宽度定
7 // var rem = a / (a / 10);
8 // var rem = a / 41.4;
9 a = 1280;
10 }
11 r.style.fontSize = a / 130 + "px"
12 }
13 w();
14 window.addEventListener("resize", function() { //监听横竖屏切换
15 w()
16 }, false);
17 })();
//基础font-size:16px
//css 写代码时可以借助px to rem 插件直接计算
//基础font-size:16px
//css 写代码时可以借助px to rem 插件直接计算