判断当前设备为移动端自定义 平板和pc端为375移动端样式

 在libs的setRem.js中:

let html = document.querySelector("html");
function setRem() {
    let ui_w = 375;
    let cl_w = document.documentElement.clientWidth || document.body.clientWidth;
    cl_w > 750 ? cl_w = 375 : "";
    html.style.fontSize = (cl_w / ui_w) * 10 + "px";
};

window.addEventListener('resize', setRem);
window.addEventListener("load", setRem);

在main.js中:

// 引入setRem
import "./libs/setRem.js";

在App.vue中:

html, body {
  font-size: 10px;
  max-width: 375px;
  margin: 0 auto;
  position: relative;
}

相关推荐

  1. 实现移动pc响应式css封装

    2024-06-10 20:14:05       12 阅读
  2. vue pc-移动-ipad适配

    2024-06-10 20:14:05       34 阅读
  3. 动态选择pc移动css文件

    2024-06-10 20:14:05       29 阅读

最近更新

  1. CocosCreator3.x相机实践

    2024-06-10 20:14:05       0 阅读
  2. 在 Python 中创建具有当前日期和时间的文件名

    2024-06-10 20:14:05       0 阅读
  3. Redis(基础篇)

    2024-06-10 20:14:05       0 阅读
  4. 无回显XXE攻击:隐秘的数据泄露技术

    2024-06-10 20:14:05       0 阅读

热门阅读

  1. 公式面试题总结(三)

    2024-06-10 20:14:05       6 阅读
  2. 【设计模式】基本名词

    2024-06-10 20:14:05       5 阅读
  3. leetcode290:单词规律

    2024-06-10 20:14:05       4 阅读
  4. 回溯算法复原ip,子集1和子集2

    2024-06-10 20:14:05       3 阅读
  5. 43.django里写自定义的sql进行查询

    2024-06-10 20:14:05       3 阅读
  6. 独孤思维:副业圈很多骗子

    2024-06-10 20:14:05       3 阅读
  7. Hive 面试题(九)

    2024-06-10 20:14:05       3 阅读