zoukankan      html  css  js  c++  java
  • pc端字体大小自适应几种方法

    $(window).resize(function ()// 绑定到窗口的这个事件中
    {
     var whdef = 100/1920;// 表示1920的设计图,使用100PX的默认值
     var wH = window.innerHeight;// 当前窗口的高度
     var wW = window.innerWidth;// 当前窗口的宽度
     var rem = wW * whdef;// 以默认比例值乘以当前窗口宽度,得到该宽度下的相应FONT-SIZE值
     $('html').css('font-size', rem + "px");
    });
     
    $(function(){
     
     var whdef = 50/750;// 表示750的设计图,使用50PX的默认值
     var wH = window.innerHeight;// 手机窗口的高度
     var wW = window.innerWidth;// 手机窗口的宽度
     var rem = wW * whdef;// 以默认比例值乘以当前窗口宽度,得到该宽度下的相应FONT-SIZE值
     $('html').css('font-size', rem + "px");
     
    })
     
     //REM适配
          var _self =  this ;
            _self.width = 750;
            _self.fontSize = 100; 
            _self.widthProportion =  function (){ var p = (document.body&&document.body.clientWidth||document.getElementsByTagName("html")[0].offsetWidth)/_self.width;return p>1?1:p<0.5?0.5:p;};
            _self.changePage =  function (){
            document.getElementsByTagName("html")[0].setAttribute("style","font-size:"+_self.widthProportion()*_self.fontSize+"px !important");
            }
            _self.changePage();
            window.addEventListener('resize', function (){_self.changePage();}, false ); 
  • 相关阅读:
    CodeForces
    Codeforces 1523D Love-Hate(随机化算法,sos dp)
    CodeForces
    讲题泛做
    CF vp 新题乱做
    10.11 牛客
    10.6 牛客
    10.4 牛客
    10.9 模拟考试 题解报告
    9.18 校内模拟赛 题解报告
  • 原文地址:https://www.cnblogs.com/zhouyx/p/9967941.html
Copyright © 2011-2022 走看看