微信小程序设置横屏之后原本的rpx单位就不再适用。

rpx:屏幕宽度是固定的 750rpx,也就是说:5rpx == 5 / 750 * 屏幕宽度,竖屏切换成横屏,屏幕宽度就会变大,5rpx也会随即变大。字体也就变大了。

有人说用px解决,没错,的确可以,但不同尺寸,不同分辨率的手机,屏幕的像素也不一样,这就会导致控件的大小在不同手机上的展示会有差异。

那怎么完美解决呢???

了解一下CSS3的单位 vmax,vmin

vmax 相对于视口的宽度或高度中较大的那个。其中最大的那个被均分为100单位的vmax
vmin 相对于视口的宽度或高度中较小的那个。其中最小的那个被均分为100单位的vmin

这样来看vmax,vmin也是百分比单位,这里我们使用vmin就能锁定屏幕的短边了!

只要把rpx换算成vmin就能完美解决字体变大的问题!

rpx与vmin的换算关系:

10rpx 换成 calc(10vmin * 100 / 750)==简单写==>>10rpx 换成 calc(10vmin / 7.5)
5px 换成 calc(5vmin / 3.75)

将你的 rpx 和 px 都替换按上面套就成了。

拿走请扣6666666

微信小程序横屏字体变大的完美解决方案相关推荐

  1. 微信小程序Tab选项卡切换大集合

    代码地址如下: http://www.demodashi.com/demo/14028.html 一.前期准备工作 软件环境:微信开发者工具 官方下载地址:https://mp.weixin.qq.c ...

  2. 微信小程序:字体设计符号组合多功能微信小程序源码

    这是一款主打字体设计,符号组合等多模板功能的一款微信小程序源码 内含多种功能,比如: 花式字体设计 表情字体组合设计 翅膀字体组合 火星文一键生成 符号库 空白名称 彩色网名等等 还有很多,所以小编就 ...

  3. 微信小程序引入echarts过大最佳解决方案、echarts在微信开发者工具中不跟随滑动、使用echarts控制台提示使用canvas 2d

    一.微信小程序引入echarts过大最佳解决方案 微信上传时代码包大小限制为2MB,但是当我们引入echarts以后,单echarts代码包已经973KB,因此再结合额外的业务代码以及其他资源很有可能 ...

  4. 微信小程序 openid及支付的若干问题解决方案

    微信小程序 openid及支付的若干问题解决方案 参考文章: (1)微信小程序 openid及支付的若干问题解决方案 (2)https://www.cnblogs.com/jhlqab/p/78500 ...

  5. 微信小程序自定义tab-bar遇到的问题及解决方案

    微信小程序自定义tab-bar遇到的问题及解决方案 小程序自定义tab-bar 问题一:需要点击两次才能变成选中装填 解决方案: 问题二:真机查看的时候,切换页面的时候会从上到下 解决方案: 小程序自 ...

  6. 微信小程序iconfont字体图标文件无法上传问题

    最近在写毕业设计的时候,因为微信小程序本身的字体图标无法满足我的开发需求,但是在引入之后发现开发工具预览没问题但是真机调试就出现了问题, 在查阅资料后找到了解决的办法.我将原本放在static下的字体 ...

  7. 微信小程序外部字体的导入

    事先准备 因为微信不支持外部文件夹的权限,所以首先去下载一个自己选中的字体,也就是ttf文件,将该ttf文件上传至https://transfonter.org/ 注意选中 Base64 encode ...

  8. 不仅只有微信小程序!盘点各大平台的小程序

    1.微信小程序 2017年1月9日,张小龙在2017微信公开课Pro上发布的微信小程序正式上线.根据<2020年小程序互联网发展白皮书>,目前小程序数量超过600万个,其中微信小程序占到了 ...

  9. 智能微信小程序加盟的5大源由掀起创业狂潮

    自从2014年的时候微信公众号就已经开始兴起了,使得在网络上刮起了一股微信公众号的创业狂潮,不少人因此赚的盆满钵满,今年年初,微信小程序的出现使其再次站在了互联网世界的风口上,错过了微信公众号红利的你 ...

最新文章

  1. java 千分位格式话_Java 字符串小数转成千分位格式
  2. lampp mysql 等待响应时间很长,XAMPP 最大执行时间(max_execution_time) 问题
  3. pycharm ctrl+shift+F 全局搜索失灵怎么办?(输入法关闭简繁体输入切换)
  4. break详细讲解啊
  5. Java 使用反射处理注解
  6. tcp欢动窗口机制_TCP协议中的窗口机制------滑动窗口详解
  7. 获取当地天气_6 点起来看天气预报?正经人谁看天气预报,原来是为了看她
  8. 视频过大怎么压缩变小
  9. 耶路撒冷三千年(笔记)
  10. 【自动驾驶】PurePursuit实现轨迹跟踪
  11. 计算机硬件系统测试,介绍几个常用的电脑硬件检测工具
  12. Mac 环境endnote 各种问题解决方法和word各种技巧汇总
  13. serv-u and hway3.0
  14. java eml 附件_Javamail怎样写带附件eml文件?
  15. 138企业邮箱pop/imap和smtp服务器地址
  16. ISO 8601时间格式时间创建
  17. 会议签到效率低,怎么办?用这招轻松解决
  18. 如何利用开关量信号传输装置实现工厂智能化技改?
  19. Go 语言 入门 基于 GoLand 2023.1 创建第一个Go程序
  20. wsgw登录抓包记录

热门文章

  1. 俞敏洪:一生只为一个女人奋斗
  2. His系统简介、医院信息系统(Hospital Information System
  3. 关于线性代数:方程组同解
  4. 字符串模板和dom模板的区别
  5. 微软原版系统安装Win7篇
  6. 用python代码实现 函数调用 烤红薯的例子
  7. 金九银十,一个新的王者在8月即将加冕——Treasure project(TPC)重磅来袭,你参与了吗?
  8. J204B接口数据链路的建立
  9. 我怎么就被一张照片出卖了?可怕!
  10. 2021年危险化学品经营单位安全管理人员考试试卷及危险化学品经营单位安全管理人员实操考试视频