ionic3 IPX留海适配


解决:使用 safe-area-inset-top 等 ios 安全区域变量 + meta 标签中设置 viewport-fit=cover
https://github.com/pengkobe/reading-notes/issues/436
https://imweb.io/topic/5baa38c279ddc80f36592efb (good)
步骤一:更新 cordova-plugin-statusbar 插件(非必须)
步骤二:更新 cordova-plugin-splashscreen(非必须)
步骤三:meta 添加 viewport-fit=cover 如:
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, viewport-fit=cover">
步骤四:利用苹果提供的 CSS 常量如:
padding-top: env(safe-area-inset-top);
我的做法(自测有效):
增加了 viewport-fit=cover 属性后在app.scss 中加入:

ionic3 IPX留海适配的更多相关文章
- iPhoneX快速适配,简单到你想哭。
研究了5个小时的iPhoneX适配. 从catalog,storyboard,safearea等一系列文章中发现.如果我们想完全撑满全屏.那直接建一个storyboard就好了.但撑满全屏后,流海就是 ...
- Cocos Creator iPhoneX适配的解决办法
研究了5个小时的iPhoneX适配. 从catalog,storyboard,safearea等一系列文章中发现.如果我们想完全撑满全屏.那直接建一个storyboard就好了.但撑满全屏后,流海就是 ...
- 使用AVPlayer自定义支持全屏的播放器(五)—Swift重构版本
前言 很早之前开源了一个简单的视频播放器,由于年久失修,效果惨目忍睹,最近特意花时间对其进行了深度重构.旧版本后期不再维护,新版本使用Swift实现,后续会增加更多功能.不想看文字的请自行下载代码-- ...
- 敏感、脆弱,OLED柔性屏会带给制造业怎样的灾难?
智能手机市场已经有些意兴阑珊,大家创新的点子在过去十年逐一亮剑,也带来了一些革命,现在谈到智能手机硬件,只能是更大的屏幕.更大的电池,更高的摄像头像素等等,长期的创新乏力,已经让消费者失去" ...
- 从技术层面讲,如今的iPhone还能吊打其他手机吗?
自iPhone诞生之日起,他们就走了一条绝对精品主义路线,雍容华贵.价格高昂,十年帝国长盛不衰,其中,固然有乔布斯的粉丝文化和库克高超供应链管理的作用,但究其根本,还要回归到iPhone领先竞争对手一 ...
- 新iPhone的高售价下,苹果供应商们是该笑还是该哭?
自新 iPhone发布之日起,世界就从未停止讨论其售价,越来越多的人开始困惑:新 iPhone毫无创新亮点,有什么底气卖到12799RMB呢?整个地球都在期待苹果推出廉价版 iPhone,望眼欲穿地等 ...
- TOF与结构光技术分析
TOF与结构光技术分析 一.概述 结构光(Structuredlight),通常采用特定波长的不可见的激光作为光源,它发射出来的光带有编码信息,投射在物体上,通过一定算法来计算返回的编码图案的畸变来得 ...
- 移动端H5页面高清多屏适配方案
背景 开发移动端H5页面 面对不同分辨率的手机 面对不同屏幕尺寸的手机 视觉稿 在前端开发之前,视觉MM会给我们一个psd文件,称之为视觉稿. 对于移动端开发而言,为了做到页面高清的效果,视觉稿的规范 ...
- [转]在cocos2d-x中让一个项目适配iphone、iphone retina、ipad、ipad retina四种分辨率
http://cankeyyin.blog.163.com/blog/static/12336178320124149391202/ 原理:将iphone的hd图片给ipad用,即: 使用原iphon ...
随机推荐
- ubuntu 编译并安装resin3.1.12+nginx1.2.6
一.先装jdk 先建立如下两个目录: mkdir /usr/lib/jvm mkdir /usr/lib/jvm/java 把jdk-6u26-linux-x64.bin文件传到上面目录下: chmo ...
- 刷题向》DP》关于基础DP(easy)
openjudge 8464 这道题其实很简单,算是DP的基础题,比较适合开拓DP思维. 题目比较有欺骗性,其实稍微想想就可以解决,因为题意说第一次卖出后才能买入,所以我们可以考虑枚举断点,所以题目 ...
- jQuery 对象和 json 之间的转换
JSON.parse() json 转换成 对象 JSON.stringify() 对象转换成json 想问下广大网友大神 js 里面有数组转换或者转换成数组的函数么?小弟等--
- Luogu 3616 富金森林公园
刚看到此题的时候:sb分块??? Rorshach dalao甩手一句看题 于是回去看题……果然是题读错了…… [思路] 对权值离散化后(要先读入所有输入里的权值一起离散化……所以一共有4e4个数据( ...
- PostgreSQL9.3+PostGIS2.1安装配置
Postgresql——Postgresql是一种对象关系型数据库.下载地址:http://www.postgresql.org/download/ postgis (可选)——是一个空间数据库,它扩 ...
- laravel的orm增删改查
增: //通过模型新增 //使用模型的create方法新增数据 删: //通过模型删除 //通过主键删除 改: //通过模型更新数据库 //结合查询语句批量更新 查:
- linux信号基本概念及如何产生信号
linux信号基本概念及如何产生信号 摘自:https://blog.csdn.net/summy_j/article/details/73199069 2017年06月14日 09:34:21 阅读 ...
- bootstrap实现嵌套列
<!DOCTYPE html> <html> <head> <title>Bootstrap 实例 - 嵌套列</title> <li ...
- win7桌面鼠标右键过慢的解决方案
由于Intel显卡驱动在桌面右键的加载项造成.解决方案:清理注册表中桌面右键加载项,点击开始,输入regedit,找到HKEY_CLASSES_ROOT\Directory\Background\sh ...
- Linux下ffmpeg安装与开发配置
Linux下ffmpeg安装与开发配置 1. ffmpeg安装 安装环境: ubuntu 12.04 (1)删除已安装的文件,避免冲突 sudo apt-get remove ffmpeg x26 ...