当前位置： 首页 > news >正文

微信小程序底部按钮适配iPhoneX以上，显示遮挡问题

news 2025/7/12 19:59:22

只需要在给底部按钮加个样式


/* 底部导航栏容器 */
.button-box {/* 使用 safe-area-inset-bottom 属性适配 iPhone X 及以上型号设备 */padding-bottom: constant(safe-area-inset-bottom);padding-bottom: env(safe-area-inset-bottom);/* 其他样式属性 */
}

iPhone6/7/8效果
在这里插入图片描述
iphoneX以上：
在这里插入图片描述

http://www.lryc.cn/news/286932.html

相关文章：

  • Qt容器QMap（映射）
  • AI时代的创新工具：如何利用AI生成独具个性的XMind思维导图？
  • 【每日一题】最长交替子数组
  • gin数据解析和绑定
  • TCP服务器最多支持多少客户端连接
  • UML类图学习
  • 死锁面试题详解
  • 【rust/bevy】使用points构造ConvexMesh
  • 【C语言】string.h——主要函数总结
  • 如何在前端优化中减少页面加载时间？
  • Typecho后台无法登录显示503 service unavailable问题及处理
  • Python入门（一）
  • 云表企业级无代码案例-自主开发ERP管理系统
  • Qt —— 编译Qt5版本QFTP库，并实现连接服务、获取列表、上传、下载、删除文件等操作（附源码、附基于Qt5编译好的QFTP库）
  • 碰到es6的...拓展运算符
  • JDK8新特性详解
  • ELK+Filebeat 部署实验
  • 利用wireshark lua扩展能力增加自定义解析器[注释解读版]
  • GPT-5不叫GPT-5？下一代模型会有哪些新功能？
  • 2024.1.23(347.前k个高频元素)
  • MySQL对数据库的操作
  • 解决Unity WebGLInput插件全屏输入的问题
  • Android14实战：调整A2DP音量曲线(五十三)
  • vector讲解
  • nvm 配置淘宝镜像失效，以及安装node后 npm-v 无效
  • 【Android Gradle 插件】Gradle 基础配置 ④ ( Gradle Wrapper 配置作用 | Gradle 下载的依赖库存放位置 )
  • Deepin_Ubuntu_查看树形目录结构（tree）
  • Java Excel分割成许多小文件
  • 【心得】java从CC1链入门CC链个人笔记
  • Django migration 新增外键的坑