zoukankan      html  css  js  c++  java
  • 『REM』手机屏幕适配

    function adapt(designWidth, rem2px){
    
      var d = window.document.createElement('div');
    
      d.style.width = '1rem';
    
      d.style.display = "none";
    
      var head = window.document.getElementsByTagName('head')[0];
    
      head.appendChild(d);
    
      var defaultFontSize = parseFloat(window.getComputedStyle(d, null).getPropertyValue('width'));
    
      d.remove();
    
      document.documentElement.style.fontSize = window.innerWidth / designWidth * rem2px / defaultFontSize * 100 + '%';
    
      var st = document.createElement('style');
    
      var portrait = "@media screen and (min- "+window.innerWidth+"px) {html{font-size:"+((window.innerWidth/(designWidth/rem2px)/defaultFontSize)*100) +"%;}}";
    
      var landscape = "@media screen and (min- "+window.innerHeight+"px) {html{font-size:"+((window.innerHeight/(designWidth/rem2px)/defaultFontSize)*100) +"%;}}"
    
      st.innerHTML = portrait + landscape;
    
      head.appendChild(st);
    
      return defaultFontSize
    
    };
    
    var defaultFontSize = adapt(640, 100);
    

      转载地址:http://mp.weixin.qq.com/s/JIRN56acxvJgmzk1Fjj6LA

  • 相关阅读:
    C语言I博客作业07
    C语言I博客作业06
    C语言I博客作业05
    C语言I博客作业04
    C语言I博客作业02
    Django连接MySql数据库
    asyncio异步编程
    Django-rest framework框架
    Git版本管理工具详细教程
    MySQL的sql_mode模式说明及设置
  • 原文地址:https://www.cnblogs.com/zhoubingyan/p/8677758.html
Copyright © 2011-2022 走看看