判断当前设备为移动端自定义 平板和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       24 阅读
  2. vue pc-移动-ipad适配

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

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

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2024-06-10 20:14:05       5 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2024-06-10 20:14:05       5 阅读
  3. 在Django里面运行非项目文件

    2024-06-10 20:14:05       4 阅读
  4. Python语言-面向对象

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

热门阅读

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

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

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

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

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

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

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

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