方案一:纯色背景的情况下,解决方案就是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

这可以被添加到marginpadding或绝对位置值这样一个topleft

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. DShow + OpenGL播放视屏

    #include <DShow.h> #pragma include_alias( "dxtrans.h", "qedit.h" ) #define ...

  2. Objc将数据写入iOS真机的plist文件里

    大熊猫猪·侯佩原创或翻译作品.欢迎转载,转载请注明出处. 假设认为写的不好请多提意见,假设认为不错请多多支持点赞.谢谢! hopy ;) 怎样写入模拟器的博文在 这里 可是这对真机无论用,由于在真机环 ...

  3. Javascript实例教程:querySelector()方法接受一个CSS查询并返回匹配模式的第一个子孙元素,如果没有匹配的元素则返回null。

    文章简介:querySelector()方法接受一个CSS查询并返回匹配模式的第一个子孙元素,如果没有匹配的元素则返回null. querySelector()方法接受一个CSS查询并返回匹配模式的第 ...

  4. 【ES】简单使用

    import sys reload(sys) sys.setdefaultencoding('utf-8') from datetime import datetime from elasticsea ...

  5. 图解HTTP学习笔记——简单的HTTP协议

    简单的HTTP协议 前言 最近在学习Web开发的相关知识,发现<图解HTTP>这本书通俗易懂.所以花时间学习这本书,并记录下学习笔记. 如上图,我们每天都在浏览网页,一般我们都是在浏览器地 ...

  6. [转] 关于QT的系统总结

    出处:http://www.cnblogs.com/wangqiguo/p/4625611.html 阅读目录 编译环境与开发流程 QT项目的构成及原理 QT中的布局 QT中的通用控件 QVarian ...

  7. phpcms首页如加上用户登录的信息?

    请看效果图 我用的是cookie的方法,请先打开discuz的文件 \source\function\function_member.php 找到函数function setloginstatus() ...

  8. Linux下php安装Redis安装

    1. 下载  redis-2.4.14.tar.gz 2. 解压 tar -zxvf redis-2.4.14.tar.gz 3.cd redis-2.4.14 4. make 注意:出错 1. CC ...

  9. linux环境中iostat命令的安装,解决-bash: iostat: command not found问题

    需求说明: 今天在测试环境的主机上,准备通过iostat来查看系统的io情况,发现没有该命令 [root@testvm Packages]# iostat -bash: iostat: command ...

  10. Sql server连接数据库报错相关

    情况一:此版本的 SQL Server 不支持用户实例登录标志. 解决方法: 方法1:在连接属性的设置里边,点高级,将User Instance 设置为false,默认的true(我在中没有找到相应的 ...