zoukankan      html  css  js  c++  java
  • 手机端页面自适应解决方案

    (function (doc, win) {
            var docEl = doc.documentElement,
                resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
                recalc = function () {
                    var clientWidth = docEl.clientWidth;
                    if (!clientWidth) return;
                    if(clientWidth>=640){
                        docEl.style.fontSize = '100px';
                    }else{
                        docEl.style.fontSize = 100 * (clientWidth / 640) + 'px';
                    }
                };
    
            if (!doc.addEventListener) return;
            win.addEventListener(resizeEvt, recalc, false);
            doc.addEventListener('DOMContentLoaded', recalc, false);
        })(document, window);
    

    web自适应布局三种方案:百分比布局,弹性布局flex,rem布局。

    上方是rem布局。

    参考来源:https://www.jianshu.com/p/b00cd3506782

  • 相关阅读:
    mysql-规避重复插入
    redis-string
    redis-map
    跨库修改
    Python-批量插入
    Python-批量修改
    MongoDB操作符
    Cron表达式
    Mycat修改空指针问题
    项目中常用的linux命令
  • 原文地址:https://www.cnblogs.com/dontes/p/8399520.html
Copyright © 2011-2022 走看看