方案一：纯色背景的情况下，解决方案就是background-color在您的body代码上设置属性；

方案二：视口入，viewport-fit=cover:

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

方案三：前提，在用了方案二的时候，最好在用此方案，就完善了，安全区，inset_*

  • safe-area-inset-top
  • safe-area-inset-right
  • safe-area-inset-left
  • safe-area-inset-botto

这可以被添加到margin，padding或绝对位置值这样一个top或left。

padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);

文档地址：

http://stephenradford.me/removing-the-white-bars-in-safari-on-iphone-x/

iPhone X 上删除白条的更多相关文章

  1. 通过Mac远程调试iPhone/iPad上的网页(转)

    我们知道在 Mac/PC 上的浏览器都有 Web 检查器这类的工具(如最著名的 Firebug)对前端开发进行调试,而在 iPhone/iPad 由于限于屏幕的大小和触摸屏的使用习惯,直接对网页调试非 ...

  2. Iphone H5上传照片被旋转

    最近做项目发现在Iphone下,我们上传图片都会被翻转,最后查阅资料发现,的确是IOS的问题 不说过程,直接解决方法 iOS下,html方式使用<input type="file&qu ...

  3. iPhone 屏幕上的 Home 键在哪里？（已解决）

    「问」:iPhone屏幕上的Home键如何开启? 「答」:在[设置]-[通用]-[辅助功能]-[AssistiveTouch],打开即可.不需要下载什么App. [Settings] - [Gener ...

  4. 解决iphone safari上的圆角问题

    -webkit-appearance : none ; /*解决iphone safari上的圆角问题*/

  5. 怎样配置git ssh连接,怎样在GitHub上加入协作开发人员,怎样配置gitignore和怎样在GitHub上删除资源库.

    **********1.在运行git push origin master指令时报例如以下错误: iluckysi@ILUCKYSI-PC /d/ilucky/message/code (master ...

  6. 苹果iPhone X上搭载的那颗A11仿生芯片，到底牛在哪？

    苹果iPhone X上搭载的那颗A11仿生芯片,到底牛在哪? 上周,苹果公司在刚刚落成投入使用的“飞船”新总部(Apple Park)举行2017年秋季新品发布会,整场发布会基本被iPhone X抢尽 ...

  7. Linux上删除大量文件几种方式对比

    目录 Linux上删除大量文件几种方式对比 1. rm删除:因为文件数量太多,rm无法删除(报错) 2. find查找删除:-exec 3. find查找删除:xargs 4. find调用-dele ...

  8. 在iPhone手机上写了input type="date" 显示不出来的原因

    在iPhone手机上写了input type="date" 显示不出来的原因 今天在手机页面上使用新的input类型,这样子写,在chrome浏览器上浏览,很好,显示出来.然后用i ...

  9. 根据某条件给GridView符合条件的值画上删除线

    如博文标题,根据某些条件对GridView控件中,对符合条件的值画上删除线效果.实现这些要求,只人捕获到哪些符合要求的数据即可.GridView控件是在TemplateField模版显示数据,Insu ...

随机推荐

  1. k8s sidecar, Ambassador, Adapter containers

    When you start thinking in terms of Pods, there are naturally some general patterns of modular appli ...

  2. SpringCloud 集锦

    一.SpringCloud和Dubbo SpringCloud整合了一套较为完整的微服务解决方案框架,而Dubbo只是解决了微服务的几个方面的问题. content Dubbo SpringCloud ...

  3. js中的方法调用

    <script> var m = {com: { sao: {citi:{}}}}; m.com.sao.citi.init = new function() { this.name = ...

  4. Mac eclipse 连接安卓手机调试 adb

    echo 手机厂商号 >>  ~/.android/adb_usb.ini  ~ echo 0x18d1 >>  ~/.android/adb_usb.ini 重启系统即可 环 ...

  5. Oracle 一个中文汉字 占用几个字节,由Oracle中字符集编码决定

    Oracle 一个中文汉字 占用几个字节,要根据Oracle中字符集编码决定 查看oracle server端字符集 select userenv('language') from dual; 如果显 ...

  6. datepicker clone 控件错误

    删除id,并删除hasDatepicker //+ -  function changeRows(sender,desc){ var tr = $(sender).closest("tr&q ...

  7. 【WP8】Uri关联启动第三方App

    在WP8中支持启动第三方应用程序,比如在App1中可以打开App2,你可以在你的应用程序中直接打开QQ,也可以让其他开发者调用你的APP,例如:软件盒子 下面演示被调用方和调用方的使用方法,新建两个项 ...

  8. vue给input file绑定函数获取当前上传的对象

    HTML <input type="file" @change="tirggerFile($event)"> JS(vue-methods) tir ...

  9. str_replace使用

    $begintime=str_replace("-", "","2014-03-05");        (需要替换的字符串,换成字符串,需 ...

  10. sql2008，sa不能使用：不能为主体 sa 中设置凭据

    打开属性对话框,为 SQL Server Administrator 帐户,然后您执行了"sa"登录使用 SQL Server Management Studio 工具.您修改为在 ...