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

CSS_IOS适配状态栏和IOS底部安全区域

状态栏

var(--status-bar-height)

计算属性

height: calc(var(--status-bar-height) + 343px);

底部安全区

先constant再env

constant(safe-area-inset-bottom)
env(safe-area-inset-bottom)

计算属性

height: calc(132px + constant(safe-area-inset-bottom));
height: calc(132px + env(safe-area-inset-bottom));

safe-area-inset-left: 安全区域距离左边界的距离
safe-area-inset-right: 安全区域距离右边界的距离
safe-area-inset-top: 安全区域距离顶部边界的距离
safe-area-inset-bottom: 安全区域距离底部边界的距离

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

相关文章:

  • 中央仓库更新失败,IDEA报错repository is non-nexus repo, or does not indexed
  • 设计模式--代理模式
  • 链路聚合原理
  • el-table表尾添加合计行,自动合计,且特殊列自定义计算展示
  • uview ui 1.x ActonSheet项太多,设置滚动(亲测有效)
  • STM32 Cubemx 同名外设中断及回调
  • 储能辅助电力系统调峰的容量需求研究(matlab代码)
  • 非计算机科班如何丝滑转码?(本人就是有点不丝滑)
  • tensorrtx部署yolov5 6.0
  • 用html5写一个音乐播放器
  • postgresql类型转换函数
  • Go 自学:Array阵列
  • 大数据平台与数据仓库的五大区别
  • React 钩子汇总
  • Python爬取旅游网站数据机票酒店价格对比分析
  • OA项目之会议通知(查询是否参会反馈详情)
  • 如何维护自己的电脑的措施
  • VS2022 Community 安装步骤
  • vue3中mitt.js使用
  • Redis 内存淘汰策略详解
  • 初识Redis之分布式
  • 计算机网络-笔记-第三章-数据链路层
  • 【1】openGL glew示例代码分析绘制一个三角形
  • android:新建工程文件介绍
  • 强化历程6-网络系列(2023.8.30)
  • 下载MedShapeNet
  • 根据身高重建队列【贪心算法】
  • 基于Java+SpringBoot+Mybaties-plus+Vue+ElementUI 高校汉服租赁网站的 设计与实现
  • SQL-DQL
  • 手写深拷贝方法