移动端
微信小程序 自定义头部导航栏 navigationStyle
使用方法;Demo下载文章底部 一、公共参数设置 app.js
1234567891011121314//获取当前设备状态栏高度App({onLaunch: function() {wx.getSystemInfo({success: res => {this.statusBarHeight = res.statusBarHeight}})},statusBarHeight: 0,globalData: {userInfo: null}})app.json [crayon-6…
开发移动端项目如何rem适配
12345678910111213141516171819202122232425window.addEventListener('resize', setHtmlFontSize)setHtmlFontSize();function setHtmlFontSize() {// 根据屏幕的宽度来改变根元素的字体大小的值// 当前屏幕 / 标准的375屏幕 求得你当前屏幕是标准屏幕的多少倍 * 标准屏幕根元素的字体大小// 当前屏幕的宽度 / 375 * 100// 假如当前750/375 = 2 * 100 == 200px// 1. 当前屏幕的宽度var windowWidth = document.documentElement.offsetWidth;// 限制最大屏幕 和最小屏幕if (windowWidth > 640) {windowWidth = 640;} else if (windowWidth < 320) {windowWidth = 320;}//2. 标准屏幕的宽度var StandardWidth = 375;// 标准屏幕的html的字体大小var StandardHtmlFontSize = 100;//3. 当前屏幕需要设置的根元素的字体大小//要设置的根元素字体大小 = 当前屏幕宽度 / 标准屏幕宽度 * 标准屏幕的html的字体大小var htmlFontSize = windowWidth / StandardWidth * StandardHtmlFontSize;//4. 把当前计算的html 字体大小设置到页面的html元素上就可以document.querySelector('html').style.fontSize = htmlFontSize + 'px';}将以上代码引入项目的每个html文件。 例如我用MUI框架开发项目,项目文件结构搭建好,引入相应的M…