欢迎您访问 最编程 本站为您分享编程语言代码,编程技术文章!
您现在的位置是: 首页

在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 插件直接计算