• 移动端根据dpr适配


        'use strict';
    /**
     * @param {Number} [baseFontSize = 100] - 基础fontSize, 默认100px;
     * @param {Number} [fontscale = 1] - 有的业务希望能放大一定比例的字体;
     */
    const win = window;
      const _baseFontSize = 150;
      const _fontscale = 1;
    
      const doc = win.document;
      const ua = navigator.userAgent;
      const matches = ua.match(/Android[Ss]+AppleWebkit/(d{3})/i);
      const UCversion = ua.match(/U3/((d+|.){5,})/i);
      const isUCHd = UCversion && parseInt(UCversion[1].split('.').join(''), 10) >= 80;
      const isIos = navigator.appVersion.match(/(iphone|ipad|ipod)/gi);
      let dpr = win.devicePixelRatio || 1;
      if (!isIos && !(matches && matches[1] > 534) && !isUCHd) {
        // 如果非iOS, 非Android4.3以上, 非UC内核, 就不执行高清, dpr设为1;
        dpr = 1;
      }
      const scale = 1 / dpr;
    
      let metaEl = doc.querySelector('meta[name="viewport"]');
      if (!metaEl) {
        metaEl = doc.createElement('meta');
        metaEl.setAttribute('name', 'viewport');
        doc.head.appendChild(metaEl);
      }
      metaEl.setAttribute('content', 'width=device-width,user-scalable=no,initial-scale=' +
        scale +',maximum-scale=' + scale + ',minimum-scale=' + scale);
      doc.documentElement.style.fontSize = `${_baseFontSize / 2 * dpr * _fontscale}px`;

    在html插入这段代码,然后在样式文件使用base字体为75px的基准转换px到rem即可。必要时还可以通过vh,vw调整。

    https://www.jianshu.com/p/e96ccb603a50

  • 相关阅读:
    Spring----Day03
    Spring----Day02
    python
    python
    python
    python
    python
    python
    python
    python
  • 原文地址:https://www.cnblogs.com/huashiyiqike/p/10521511.html
Copyright © 2020-2023  润新知