zoukankan      html  css  js  c++  java
  • 如何使用rem写自适应的手机端页面?

    主要使用了js控制

    /**
     * @description: rem缩放
     */
    (function () {
    	
    	
    	
        updateOrientation();
        var supportOrientation = (typeof window.orientation === 'number' &&
            typeof window.onorientationchange === 'object');
        if (supportOrientation) {
            window.addEventListener('orientationchange', updateOrientationDelay, false);
        } else {
            window.addEventListener('resize', updateOrientationDelay, false);
        }
    
        function updateOrientation() {
            var deviceWidth = document.documentElement.clientWidth;
            if (deviceWidth > 750) deviceWidth = 750;
            document.documentElement.style.fontSize = deviceWidth / 7.5 + 'px';
        }
    
        function updateOrientationDelay() {
            setTimeout(function () {
                updateOrientation()
            }, 100);
        }
    }());
    

    再搭配一个reset.css

    就可以顺利开始了 这里设计稿是750的,视真实情况而定。

  • 相关阅读:
    应用层
    传输层
    一元函数微分学
    函数、极限、连续
    网络层习题与真题
    网络层
    数据链路层习题与真题
    二、使用kubeadm部署k8s
    一、Kubernetes概述
    二、rsync文件同步
  • 原文地址:https://www.cnblogs.com/heson/p/11205416.html
Copyright © 2011-2022 走看看