首页 > 其他分享 >rem 适配手机端

rem 适配手机端

时间:2023-04-11 17:33:09浏览次数:50  
标签:function 适配 text && rem var 手机 font

http://g.tbcdn.cn/mtb/lib-flexible/0.3.2/??flexible_css.js,flexible.js

!function(){var a="@charset \"utf-8\";html{color:#000;background:#fff;overflow-y:scroll;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}html *{outline:0;-webkit-text-size-adjust:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}html,body{font-family:sans-serif}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td,hr,button,article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{margin:0;padding:0}input,select,textarea{font-size:100%}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}abbr,acronym{border:0;font-variant:normal}del{text-decoration:line-through}address,caption,cite,code,dfn,em,th,var{font-style:normal;font-weight:500}ol,ul{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:500}q:before,q:after{content:''}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}a:hover{text-decoration:underline}ins,a{text-decoration:none}",b=document.createElement("style");if(document.getElementsByTagName("head")[0].appendChild(b),b.styleSheet)b.styleSheet.disabled||(b.styleSheet.cssText=a);else try{b.innerHTML=a}catch(c){b.innerText=a}}();!function(a,b){function c(){var b=f.getBoundingClientRect().width;b/i>540&&(b=540*i);var c=b/10;f.style.fontSize=c+"px",k.rem=a.rem=c}var d,e=a.document,f=e.documentElement,g=e.querySelector('meta[name="viewport"]'),h=e.querySelector('meta[name="flexible"]'),i=0,j=0,k=b.flexible||(b.flexible={});if(g){console.warn("灏嗘牴鎹凡鏈夌殑meta鏍囩鏉ヨ缃缉鏀炬瘮渚�");var l=g.getAttribute("content").match(/initial\-scale=([\d\.]+)/);l&&(j=parseFloat(l[1]),i=parseInt(1/j))}else if(h){var m=h.getAttribute("content");if(m){var n=m.match(/initial\-dpr=([\d\.]+)/),o=m.match(/maximum\-dpr=([\d\.]+)/);n&&(i=parseFloat(n[1]),j=parseFloat((1/i).toFixed(2))),o&&(i=parseFloat(o[1]),j=parseFloat((1/i).toFixed(2)))}}if(!i&&!j){var p=(a.navigator.appVersion.match(/android/gi),a.navigator.appVersion.match(/iphone/gi)),q=a.devicePixelRatio;i=p?q>=3&&(!i||i>=3)?3:q>=2&&(!i||i>=2)?2:1:1,j=1/i}if(f.setAttribute("data-dpr",i),!g)if(g=e.createElement("meta"),g.setAttribute("name","viewport"),g.setAttribute("content","initial-scale="+j+", maximum-scale="+j+", minimum-scale="+j+", user-scalable=no"),f.firstElementChild)f.firstElementChild.appendChild(g);else{var r=e.createElement("div");r.appendChild(g),e.write(r.innerHTML)}a.addEventListener("resize",function(){clearTimeout(d),d=setTimeout(c,300)},!1),a.addEventListener("pageshow",function(a){a.persisted&&(clearTimeout(d),d=setTimeout(c,300))},!1),"complete"===e.readyState?e.body.style.fontSize=12*i+"px":e.addEventListener("DOMContentLoaded",function(){e.body.style.fontSize=12*i+"px"},!1),c(),k.dpr=a.dpr=i,k.refreshRem=c,k.rem2px=function(a){var b=parseFloat(a)*this.rem;return"string"==typeof a&&a.match(/rem$/)&&(b+="px"),b},k.px2rem=function(a){var b=parseFloat(a)/this.rem;return"string"==typeof a&&a.match(/px$/)&&(b+="rem"),b}}(window,window.lib||(window.lib={}));

把这个文件直接引入到项目中,

vscode 中需要插件

 

 

 

 

标签:function,适配,text,&&,rem,var,手机,font
From: https://www.cnblogs.com/gxywb/p/17307034.html

相关文章

  • [LeetCode] 2390. Removing Stars From a String
    Youaregivenastring s,whichcontainsstars *.Inoneoperation,youcan:Chooseastarin s.Removetheclosest non-star charactertoits left,aswellasremovethestaritself.Return thestringafter all starshavebeenremoved.Note:Thei......
  • Qt for Android QtQuick应用程序 USB连接手机调试运行错误:adb: failed to *.apk: No s
    1.场景Windows11、Qt6.5.0QtQuick应用程序USB连接手机调试运行。2.错误信息adb:failedto*.apk:NosuchfileordirectoryInstallingtodevicefailed!进程"C:\Users\Administrator\Qt\6.5.0\mingw_64\bin\androiddeployqt.exe"退出,退出代码16。安装应用失败,发生未知错......
  • 手机上哪款闹钟提醒APP好
    相信有不少小伙伴都有这样的烦恼,随着进入职场工作的时间越来越久,每天要完成的各种事情很多,这一件件琐碎的待办事项非常容易被忽略或忘记。如果没有一个负责的“秘书”来定时提醒我们哪个时间点应该去做的事情,生活和工作势必会乱作一团。  对于普通人而言,有一个专业的秘书......
  • 2023很火的手机记事本APP
    在经济高速发展的今天,对于职场人士来说,时间是非常宝贵的,所以我们在工作中要时刻保持高效,能够准确的处理各种事项和工作任务。那么当工作中有很多信息需要记录、管理的时候,当有各种各样工作任务需要完成的时候,职场人士应该如何快速记录下来这些内容呢?  在2023年越来越多......
  • 不要直接运行yum remove!
    yuminstall是安装软件,对应的yumremove是卸载软件,但是如果你对于yumremove也回答yes的话,很可能会把系统搞崩溃的。比如:安装和卸载nginx使用yuminstallnginx安装了nginx,这是如果直接使用yumremovenginx的话,会把依赖的一些包也删掉。所以要使用rpm-e--nodepsnginx这......
  • MFC-RemoveProp删除窗口属性
     HANDLEh=::RemoveProp(m_hWnd,g_szPropName);//删除窗口属性/*从窗口属性表中删除一个属性参数1:HWNDhWnd窗口的句柄参数2:LPCTSTRlpString要删除的属性返回值:成功返回属性的数据;失败返回值为NULL*/     ......
  • 小程序开发 登入与授权手机号码
    前言  此篇博客讲解小程序的登入功能与绑定手机号码功能登入功能登入一般在onLoad生命周期中处理请求js/***检查登入token*/checkLogin(){lettoken=wx.getStorageSync('token')if(token==null){wxlogin()......
  • 判断是不是手机
    _isMobile(){letflag=navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|WindowsPhone)/i);returnflag;},......
  • Java知识小拓展之适配器模式
    一:设计模式设计模式是一套被反复使用的、多数人知晓的、经过分类编写的、设计经验的总结。使用设计模式是为了可重用代码、让代码更容易被人理解、保证代码的可靠性、程序的可靠性。简单的理解它就像给了你一个模板,是一种像数学中的一种解题套路一样,不同的是它有各种套路。二:适配器......
  • 【笔记】VisionMobile:小米部落:手机制造商的新希望
    大过年回到单位,老台式机的XP系统不断地扭计,无奈何重装机器,打算重新分区,导出原来数据,先装了Win7,安装部分软件,想起来,还是先装Ubuntu再说,正在安装过程中,幸得这几天闲暇。进度缓慢是因为这台式机居然不支持USB3.0,慢慢考,将Win7升级到SP1出现了种种问题。小米在硬件、服务、品牌和商务......