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

兼容问题---ios底部的安全距离css设置

在H5上适配安全区域:采用viewport+env+constant方案。

具体操作如下:

1. 需要将viewport设置为cover,env和constant才能生效。设置代码如下:

<meta name="viewport" content="width=device-width,initial-scale=1.0,viewport-fit=cover">

2. 同时设置env和constant代码,同样env()和constant()需要同时存在,而且顺序不能换。

这里不一定用padding-bottom可以是margin-bottom设置,具体看实际情况!

@supports
(bottom: constant(safe-area-inset-bottom))
or (bottom: env(safe-area-inset-bottom)) {
.盒容器类名 {
padding-bottom: constant(safe-area-inset-bottom);
padding-bottom: env(safe-area-inset-bottom);
}
}

3. 注意事项:

有一点要注意,在IOS11.2系统以前,可以使用constant()函数,但是在IOS11.2系统以后,这个函数就被废弃了,被env()函数替代了。

所以我们在做屏幕适配时,需要这样写:

padding-bottom: constant(safe-area-inset-bottom); /*兼容 IOS<11.2*/
padding-bottom: env(safe-area-inset-bottom); /*兼容 IOS>11.2*/ 

相关文章:

兼容问题---ios底部的安全距离css设置

在H5上适配安全区域&#xff1a;采用viewportenvconstant方案。 具体操作如下&#xff1a; 1. 需要将viewport设置为cover&#xff0c;env和constant才能生效。设置代码如下&#xff1a; <meta name"viewport" content"widthdevice-width,initial-scale1.…...

python JSON Lines (JSONL)的保存和读取;jsonl的数据保存和读取,大模型prompt文件保存常用格式

1. JSON Lines (JSONL)文件保存 将一个包含多个字典的列表保存为 JSON Lines (JSONL) 格式的文件&#xff0c;每个字典对应一个 JSONL 文件中的一行。以下是如何实现这一操作的 Python 代码 import json# 定义包含字典的列表 data [{"id": 1, "name": &qu…...

Spring Boot中@Async注解的使用及原理 + 常见问题及解决方案

&#x1f604; 19年之后由于某些原因断更了三年&#xff0c;23年重新扬帆起航&#xff0c;推出更多优质博文&#xff0c;希望大家多多支持&#xff5e; &#x1f337; 古之立大事者&#xff0c;不惟有超世之才&#xff0c;亦必有坚忍不拔之志 &#x1f390; 个人CSND主页——Mi…...

ubuntu基于cmakelist的Qt工程,如何将图片打包进二进制程序

qt界面使用的图片打包进入二进制可执行程序&#xff0c;可以避免发布的软件&#xff0c;因为路径问题无法加载图片的问题。 以下步骤参考自百度AI. 步骤如下&#xff1a; 1.创建一个新的Qt资源文件&#xff08;.qrc文件&#xff09; 2.在*.qrc文件中添加图片路径 qrc文件使用…...

Spring的启动流程refresh方法、配置类解析流程@Component、@Configuration、@Import、@Bean

Spring的启动流程概述&#xff1a; 核心方法&#xff1a; refresh方法&#xff0c;作用就是实例化spring容器中的所有单例。 3步&#xff1a; 生成BeanFactory容器&#xff08;有beanDefinition类信息和bean对象实例&#xff09;生成BeanDefinition类信息生成bean对象实例 需…...

运算放大器(2)

&#xff08;1&#xff09;反向放大器 Vout(-R2/R1)*Vi 图一运放的同向端接地0V&#xff0c;反向端和同向端虚短&#xff0c;所以也是0V 反向输入端输入电阻很高&#xff0c;虚断&#xff0c;几乎没有电流注入和流出&#xff0c;那么R1和R2相当于是串联的&#xff0c;流过一个…...

智能优化算法之模拟退火算法SA

发展历史和算法思想 模拟退火算法&#xff08;Simulated Annealing, SA&#xff09;是一种基于热力学原理的随机优化算法&#xff0c;最早由 S. Kirkpatrick, C. D. Gelatt 和 M. P. Vecchi 于 1983 年提出。算法的灵感来自于固体物理学中的退火过程&#xff1a;通过加热和缓慢…...

同时用到,网页,java程序,数据库的web小应用

具体实现功能&#xff1a;通过网页传输添加用户的请求&#xff0c;需要通过JDBC来向 MySql 添加一个用户数据 第一步&#xff0c;部署所有需要用到的工具 IDEA(2021.1),Tomcat(9),谷歌浏览器&#xff0c;MySql,jdk(17) 第二步&#xff0c;创建java项目&#xff0c;提前部署数…...

星环科技推出语料开发工具TCS,重塑语料管理与应用新纪元

5月30-31日&#xff0c;2024向星力未来数据技术峰会期间&#xff0c;星环科技推出一款创新的语料开发工具——星环语料开发工具TCS&#xff08;Transwarp Corpus Studio&#xff09;&#xff0c;旨在通过全面的语料生命周期管理&#xff0c;极大提升语料开发效率&#xff0c;助…...

【ARM】MDK安装ARM_compiler5无法打开安装程序

【更多软件使用问题请点击亿道电子官方网站】 1、 文档目标 在客户安装了最新版本的MDK5.37及后续更新版本&#xff0c;但原工程使用ARM_Compiler_5.06进行编译和调试&#xff0c;需安装ARM_Compiler_5.06的编译器版本&#xff0c;但在解压缩的过程中后续无法打开ARM_Compiler…...

PHP文字ocr识别接口示例、人工智能的发展

全球在人工智能升级的大背景下&#xff0c;有一定规模的制造商开始大量部署人工智能机器人、系统&#xff0c;以此取代危险、简单和重复性的工作。各种人工智能技术的迅猛发展&#xff0c;正在驱动各行业就业市场发现变革。 京东物流大家并不陌生&#xff0c;京东快递机器人在…...

【2024 全国青少年信息素养大赛复赛指南】算法创意实践挑战赛复赛、智能算法应用挑战赛复赛指南

目录 2024 全国青少年信息素养大赛算法创意实践挑战赛复赛指南 一、比赛内容 二、编程题作答说明 三、准备说明 四、进入复赛 五、设备检测 六、答题与交卷 全国青少年信息素养大赛智能算法应用挑战赛复赛指南 一、 比赛规则: 二、学生具体操作流程 三、 评判方法…...

构建自定义Tensorflow镜像时用到的链接地址整理

NVIDIA相关&#xff1a; NVIDIA CUDA镜像的docker hub&#xff1a;https://hub.docker.com/r/nvidia/cuda/tags?page&page_size&ordering&name12.4.1NVIDIA 构建的Tensorflow镜像包&#xff1a;https://docs.nvidia.com/deeplearning/frameworks/tensorflow-rele…...

C++——二叉搜索树的实现

1、二叉搜索树的概念 二叉搜索树又叫做二叉排序树&#xff0c;他或者是一棵空树&#xff0c;或者具有以下性质&#xff1a; 若他的左子树不为空&#xff0c;则左子树的所有节点的值都小于根节点的值&#xff0c; 若他的右子树不为空&#xff0c;则右子树的所有节点的值都大于…...

【AppScan】安装教程 AppScan v10 Web应用安全测试工具(附安装包)零基础入门到精通,收藏这一篇就够了

获取方式及安装教程下滑至文章底部查看 此软件“仅限学习交流,不能用于商业用途”&#xff0c;如用于商业用途,请到官方购买正版软件,追究法律责任与本平台无关&#xff01; 配置要求 操作系统&#xff1a;64位 Win10、Win8、Win7 软件介绍 IBM AppScan是一款非常好用…...

Java项目:基于SSM框架实现的中小型企业财务管理系统【ssm+B/S架构+源码+数据库+答辩PPT+开题报告+毕业论文】

一、项目简介 本项目是一套基于SSM框架实现的中小型企业财务管理系统 包含&#xff1a;项目源码、数据库脚本等&#xff0c;该项目附带全部源码可作为毕设使用。 项目都经过严格调试&#xff0c;eclipse或者idea 确保可以运行&#xff01; 该系统功能完善、界面美观、操作简单…...

c++ - 多态

文章目录 一、多态的概念二、多态使用三、多态的原理 一、多态的概念 1、概念&#xff1a; 多态就是具有多种形态&#xff0c;可以理解为同一个行为不同对象去完成表现出不同的状态&#xff0c;如&#xff1a; 二、多态使用 1、构成多态的条件 &#xff08;1&#xff09;派…...

亚马逊云科技EC2简明教程

&#x1f4a1; 完全适用于新手操作的Amazon EC2引导教程 简述 在亚马逊云科技中&#xff0c;存在多种计算服务&#xff0c;在此&#xff0c;我们将会着重讨论Amazon EC2(以下简称EC2)&#xff0c;EC2作为亚马逊云科技的明星产品、核心产品&#xff0c;是大多数开发者和企业用…...

TCP网络传输控制协议

目录 什么是TCP TCP的特点 TCP通信步骤 三次握手&#xff08;建立连接&#xff09; 数据传输 四次挥手&#xff08;连接释放&#xff09; 为什么要进行三次握手&#xff1f;两次握手行不行&#xff1f;一次握手行不行&#xff1f; 为什么是四次挥手&#xff1f;三次、两…...

PCDN技术如何应对网络带宽限制?(壹)

PCDN技术应对网络带宽限制的操作主要包括以下几个方面&#xff1a; 利用边缘计算资源&#xff1a;PCDN是以P2PCDN技术为基础&#xff0c;通过挖掘利用边缘网络海量碎片化闲置资源来构建内容分发网络。这意味着&#xff0c;当网络带宽受限时&#xff0c;PCDN能够更有效地利用这…...

自动化测试常用函数(操作测试对象)

上一篇我们学会了怎么用Selenium定位页面元素,接下来就是要对元素进⾏操作了。常⻅的操作有点击、提交、输⼊、清除、获取⽂本。点击&#xff1a;元素.click()输入&#xff1a;元素.send_keys("内容")清空&#xff1a;元素.clear()拿标签间文字&#xff1a;元素.text…...

免费暗黑2存档编辑器终极指南:3分钟成为游戏存档修改大师

免费暗黑2存档编辑器终极指南&#xff1a;3分钟成为游戏存档修改大师 【免费下载链接】d2s-editor 项目地址: https://gitcode.com/gh_mirrors/d2/d2s-editor 还在为暗黑破坏神2的存档问题烦恼吗&#xff1f;角色属性不够强、装备不理想、任务进度丢失……现在&#xf…...

3分钟解决阅读APP书源问题:高质量书源一键导入指南

3分钟解决阅读APP书源问题&#xff1a;高质量书源一键导入指南 【免费下载链接】Yuedu &#x1f4da;「阅读」自用书源分享 项目地址: https://gitcode.com/gh_mirrors/yu/Yuedu 还在为找不到稳定的小说书源而烦恼吗&#xff1f;是否经常遇到书源失效、加载缓慢的问题&a…...

如何5分钟部署小鹿快传:零基础P2P文件传输终极指南

如何5分钟部署小鹿快传&#xff1a;零基础P2P文件传输终极指南 【免费下载链接】deershare 小鹿快传&#xff0c;一款在线P2P文件传输工具&#xff0c;使用WebSocket WebRTC技术 项目地址: https://gitcode.com/gh_mirrors/de/deershare 小鹿快传&#xff08;DeerShare…...

Kernel-Bridge API完全参考手册:从CPU操作到内存管理

Kernel-Bridge API完全参考手册&#xff1a;从CPU操作到内存管理 【免费下载链接】Kernel-Bridge Windows kernel hacking framework, driver template, hypervisor and API written on C 项目地址: https://gitcode.com/gh_mirrors/ke/Kernel-Bridge Kernel-Bridge是一…...

Python爬虫实战:Python + curl_cffi 穿透 Adidas 新品榜:TLS 指纹伪装实战!

㊗️本期内容已收录至专栏《Python爬虫实战》&#xff0c;持续完善知识体系与项目实战&#xff0c;建议先订阅收藏&#xff0c;后续查阅更方便&#xff5e; ㊙️本期爬虫难度指数&#xff1a;⭐⭐ &#x1f250;福利&#xff1a; 一次订阅后&#xff0c;专栏内的所有文章可永久…...

2026年AI模型接口中转平台生产环境实测:主流服务商性能与成本综合排名全指南

2026年AI模型接口中转平台生产环境实测&#xff1a;主流服务商性能与成本综合排名全指南 进入2026年&#xff0c;国内AI大模型产业已经彻底走完技术验证阶段&#xff0c;全面进入规模化落地周期&#xff0c;全行业日均AI Token调用总量已经突破140万亿。如今的大模型API聚合平台…...

Option ‘importsNotUsedAsValues‘ has been removed. Please remove it from your configuration

1、背景 在前端项目中的tsconfig.json中 compilerOptions 报红&#xff0c;鼠标放上去&#xff0c;会显示如下内容&#xff1a; Option importsNotUsedAsValues has been removed. Please remove it from your configuration. Use verbatimModuleSyntax instead.ts Option p…...

别光盯着分号!从C2143编译错误,聊聊C++预处理和语法解析那些事儿

别光盯着分号&#xff01;从C2143编译错误&#xff0c;聊聊C预处理和语法解析那些事儿 当你盯着屏幕上的C2143错误&#xff0c;反复检查分号却依然无解时&#xff0c;有没有想过编译器到底"看"到了什么&#xff1f;这个看似简单的语法错误背后&#xff0c;隐藏着从源…...

工程技巧 用缓存把 Agent 延迟打下来 结果缓存 语义缓存 计划缓存

从3s到300ms:用三级缓存体系把LLM Agent响应延迟打下来|结果缓存+语义缓存+计划缓存全落地指南 副标题:面向LangChain/Agent开发人员的生产级优化方案,附可直接复用的完整代码 摘要/引言 你是不是也遇到过这样的痛点:辛辛苦苦搭好的LLM Agent,功能都跑通了,但是用户问…...