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

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


/* 底部导航栏容器 */
.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.mzph.cn/news/643036.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

vue全局公共样式

vue公共样式代码存放在/src/styles文件夹里 index里引入其他组件公共样式,index.scss文件内容如下: import ./sidebar.scss; import ./searchForm.scss;body {height: 100%;-moz-osx-font-smoothing: grayscale;-webkit-font-smoothing: antialiased;t…

hcip高级网络知识

一:计算机间信息传递原理 抽象语言----编码 编码---二进制 二进制---转换为电流(数字信号) 处理和传递数字信号 二:OSI--七层参考模型 ISO--1979 规定计算机系统互联的组织: OSI/RM ---- 开放式系统互联参考模型 --- 1…

【模拟】力扣38(Java)

题目 class Solution {public String countAndSay(int n) {String ret "1";for(int i1;i<n;i)//解释n-1次ret{StringBuffer tmp new StringBuffer();int len ret.length();for(int left 0,right 0;right<len;){//双指针while(right < len &&…

力扣精选算法100道——x的平方根(二分查找专题)

x的平方根 首先看到这个题目的时候&#xff0c;我们需要对上一个二分查找专题的题目进行深度理解&#xff0c;然后了解模板&#xff0c;这题是完全利用的上一题的模板知识进行&#xff0c;如果直接看这个题目可能是有点懵的&#xff0c;因为我这里直接利用模板进行解题。力扣…

了解HTTP/1.1、HTTP/1.0 和 HTTP/2.0

HTTP/1.1、HTTP/1.0 和 HTTP/2.0 是超文本传输协议&#xff08;HTTP&#xff09;的三个主要版本 先解释一下什么是超文本协议 超文本传输协议&#xff08;HyperText Transfer Protocol&#xff0c;简称 HTTP&#xff09;是互联网上应用最广泛的一种网络协议。设计 HTTP 的初衷是…

在Ubuntu上安装pycuda记录

1. 安装CUDA Toolkit 11.8 从MZ小师妹的摸索过程来看&#xff0c;其他版本的会有bug&#xff0c;12.0的版本太高&#xff0c;11.5的太低&#xff08;感谢小师妹让我少走弯路&#xff09; 参考网址&#xff1a;CUDA Toolkit 11.8 Downloads | NVIDIA Developer 在命令行输入命…

尝试为ssrf漏洞编写黑名单与白名单

以pikachu靶场ssrf&#xff08;curl&#xff09;为例&#xff1a; 你会发现什么也没防御项访问基本的文件内容&#xff0c;端口开放都是可以看到的&#xff0c;没有任何防御措施。 我们去查看一下他的源码有没有过滤什么 没有任何过滤&#xff0c;咱么尝试进行过滤一下&#xf…

2024美赛数学建模思路 - 案例:粒子群算法

文章目录 1 什么是粒子群算法&#xff1f;2 举个例子3 还是一个例子算法流程算法实现建模资料 # 0 赛题思路 &#xff08;赛题出来以后第一时间在CSDN分享&#xff09; https://blog.csdn.net/dc_sinor?typeblog 1 什么是粒子群算法&#xff1f; 粒子群算法&#xff08;Pa…

peer eslint-plugin-vue@“^7.0.0“ from @vue/eslint-config-standard@6.1.0

问题&#xff1a; 用vue/cli脚手架安装项目时&#xff0c;选择ESlint&#xff0c;再安装依赖包的时候&#xff0c;会报以下错误&#xff0c; 原因&#xff1a; npmV7 之前的版本遇到依赖冲突时&#xff0c;会忽视冲突&#xff0c;继续安装&#xff1b; npmV7版本开始不再自动忽…

java web servlet 学习系统进度管理系统Myeclipse开发mysql数据库web结构java编程计算机网页项目

一、源码特点 java Web学习系统进度管理系统是一套完善的java web信息管理系统 &#xff0c;对理解JSP java编程开发语言有帮助&#xff0c;系统具有完整的源代码和数据库&#xff0c;系统主要采用B/S模式开发。开发环 境为TOMCAT7.0,Myeclipse8.5开发&#xff0c;数据库为…

Vue中$watch()方法和watch属性的区别

vue中$watch()和watch属性都是监听值的变化的&#xff0c;是同一个作用&#xff0c;但是有两个不同写法。 用法一&#xff1a; //注意&#xff1a;这种方法是监听不到对象的变化的。 this.$watch((newVal,oldVal)>{ }) 用法二&#xff1a; watch:{xxx:(newVal,oldVal)>…

NodeJS安装教程

1、 官网下载安装包 可以自己在官网下载 Node.Js中文网 https://nodejs.p2hp.com/ 2、安装步骤 1、双击安装包&#xff0c;一直点击下一步。 2、点击change按钮&#xff0c;更换到自己的指定安装位置&#xff0c;点击下一步&#xff08;不修改默认位置也是可以的 &#xf…

Simulink|光伏并网逆变器低电压穿越仿真模型

目录 主要内容 模型研究 1.模型总览 2.boost模块 3.Inverter模块 4.控制模块 5.信号模块 结果一览 下载链接 主要内容 该模型为光伏逆变器低电压穿越仿真模型&#xff0c;采用boost加NPC拓扑结构&#xff0c;基于MATLAB/Simulink建模仿真。模型具备中点平衡…

openai assistants api接入微信机器人,实现类GPTs功能

chatgpt网址:https://chat.xutongbao.top 比普通gpt多了代码解释器功能&#xff0c;和上传训练数据文件的功能&#xff0c;这两个功能就是GPTs拥有的&#xff0c;而普通gpt没有拥有的

Linux系统Shell脚本 ----- 编程规范和变量详细解读

一、Shell脚本概述 1、什么是Shell Linux系统中运行的一种特殊程序在用户和内核之间充当“翻译官”用户登录Linux系统时&#xff0c;自动加载一个Shell程序Bash是Linux系统中默认使用的Shell程序 2、Shell的作用 Linux系统中的shell是一个特殊的应用程序&#xff0c;它介于操…

商城系统中30分钟未付款自动取消订单怎么实现(简单几种方法)

实现以上功能 方法1&#xff1a;定时任务批量执行 写一个定时任务&#xff0c;每隔 30分钟执行一次&#xff0c;列出所有超出时间范围得订单id的列表 AsyncScheduled(cron "20 20 1 * * ?")public void cancelOrder(){log.info("【取消订单任务开始】"…

HTTP/1.1、HTTP/2、HTTP/3 基本概述

参考链接 https://xiaolincoding.com/network/2_http/http_interview.html#http-1-1-%E7%9B%B8%E6%AF%94-http-1-0-%E6%8F%90%E9%AB%98%E4%BA%86%E4%BB%80%E4%B9%88%E6%80%A7%E8%83%BD HTTP/1.1 HTTP/1.1 相比 HTTP/1.0 性能上的改进&#xff1a; 使用长连接的方式改善了 HTT…

Leetcode—25.K 个一组翻转链表【困难】

2023每日刷题&#xff08;八十二&#xff09; Leetcode—25.K 个一组翻转链表 算法思想 实现代码 /*** Definition for singly-linked list.* struct ListNode {* int val;* ListNode *next;* ListNode() : val(0), next(nullptr) {}* ListNode(int x) : val…

Conda python管理packages一 从入门到精通

Conda系列&#xff1a; 翻译: Anaconda 与 miniconda的区别Miniconda介绍以及安装Conda python运行的包和环境管理 入门Conda python管理环境environments 一 从入门到精通Conda python管理环境environments 二 从入门到精通Conda python管理环境environments 三 从入门到精通…

力扣每日一题 ---- 1970. 你能穿过矩阵的最后一天

这题对于没怎么做到过这题的朋友来说比较陌生&#xff0c;他给出的条件是两个都是动态的条件&#xff0c;一个条件随着另一个条件走&#xff0c;这个时候是很熟悉这题的朋友就会感觉比较麻烦&#xff0c;比较难&#xff0c;就不想写了&#xff0c;两个强相关条件的第一个是水每…