• safe area: 默认放置在安全区域以避免遮挡, 但会压缩

  • 在meta中添加viewport-fit=cover: 告诉浏览器要讲整个页面渲染到浏览器中，不管设备是圆角与否，这个时候会造成页面的元素被圆角遮挡

  • padding: constant(env): 解决遮挡问题

如何处理异形屏iphone X?的更多相关文章

  1. 大屏iPhone的适配 +iOS 图片尺寸要求

    摘自:http://blog.ibireme.com/2014/09/16/adapted_to_iphone6/ 苹果公司官网设计介绍到:Retina显示屏的超高像素密度已超过人眼能分辨的范围.Re ...

  2. 移动端Web开发如何处理横竖屏

    <!Doctype html> <html> <head> <meta charset="utf-8"> <meta id=& ...

  3. Web前端面试题整合，持续更新【可以收藏】

    饭后闲来无事,把这几年带学生用的一些面试题整合一下,供上!拿走,不客气!应付一般公司的二面基本上是够用了.祝你早日拿到心仪的offer. css相关 1. 万能居中 1.margin: 0 auto; ...

  4. 小程序学习-iPhone X适配

    一.  安全区域(safe area) 与iPhone6/6s/7/8相比,iPhone X 无论是在屏幕尺寸.分辨率.甚至是形状上都发生了较大的改变,下面以iPhone 8作为参照物,先看看iPho ...

  5. “设计之变”--从iPhone应用到iPad应用

    在做APP的iPad版本设计时,我们常常需要考虑:如何在延续iPhone版本设计特色和优点同时,充分利用iPad的特性更好地进行设计.本文从iPad和iPhone的差异性入手,试图总结这一设计过程中需 ...

  6. iphone尺寸设计

    http://www.paintcodeapp.com/news/ultimate-guide-to-iphone-resolutions http://daily.zhihu.com/story/4 ...

  7. iPhone 6/6 Plus国行版开卖当日抢购攻略

    在距离苹果首批发售时隔一个月也就是北京时间10月17日,苹果iPhone 6.iPhone 6 Plus终于也要在中国大陆开卖,众多国内用户终于有机会安排自己的购机计划.据不完全数据显示,目前iPho ...

  8. iPhone 6/6 Plus 出现后，如何改进工作流以实现一份设计稿支持多个尺寸？

    iPhone 6/6 Plus 出现后,如何改进工作流以实现一份设计稿支持多个尺寸? 2014-12-05 09:33 编辑: suiling 分类:iOS开发 来源:知乎(pigtwo)  2 22 ...

  9. iPhone 6出现后,如何将一份设计稿支持多个尺寸？

    http://mp.weixin.qq.com/s?__biz=MzA4NTQzNTMwOA==&mid=201174413&idx=3&sn=c3fe5b3459bac288 ...

随机推荐

  1. SpringBoot 自定义MessageConvert

    创建一个MessageConvert类,实现HttpMessageConvert接口 简单实现,只完成写功能.其他默认false package com.boot.converter; import ...

  2. python中继承的语法及案列

    案例: 1 class Chinese: # 类的创建,类名首字母大写 2 eye = 'black' # 类属性的创建 3 4 def eat(self): # 实例方法创建 5 print('吃饭 ...

  3. flask框架安装使用

    开篇 个人工作中需要用到flask,所以特地搭建了用一下,熟悉操作 一.centos云服务器环境下 falsk作为一个python的轻量级的web框架,基本上相当于一个内核,各种功能都需要扩展第三方来 ...

  4. 【C# IO 操作】C#修改文件或文件夹的权限，为指定用户、用户组添加完全控制权限

    代码实现 在C盘添加一个文件夹,并在文件夹内部,新建一个文本文件,如图所示: 该文件夹下,新建一个文本文件,如图所示: 为文件添加完全控制权限: /// <summary> /// 为文件 ...

  5. C#foreach 本质（ 鸭子类型遍历）

    探讨关于C#中Foreach的本质 要实现foreach需要满足什么条件? 只要类中实现类中的GetEnumerator()方法.MoveNext()方法.Current属性(俗称鸭子类型)都可以使用 ...

  6. linux /etc/fstab 文件详细说明（整理版）

    转至:https://blog.csdn.net/xiaolongwang2010/article/details/8657332?utm_medium=distribute.pc_relevant. ...

  7. Qt：打印输出到控制台，类似C++的cout

    1. #include<qDebug> 2. qDebug<<"Hello,world!"; 补充,如果不是控制台文件,比如是窗口应用程序,需要在pro文件 ...

  8. linux多进/线程编程（5）——进程间通信之mmap

    参考资料: 1.博客1:https://www.jianshu.com/p/755338d11865 mmap:一种内存映射文件的方法 memory map 父子进程和无亲缘关系的进程,都可以将自身用 ...

  9. Thymeleaf将字符串转换为数字

    Thymeleaf将字符串转换为数字 Thymeleaf将字符串转换为数字!近期努力敲代码的时候遇到一个问题,某个字段在后端使用的是String存储,但是前端thymeleaf模板需要使用这个字段做数 ...

  10. 微服务入门三：SpringCloud Alibaba

    一.什么是SpringCloud Alibaba 1.简介 1)简介 阿里云未分布式应用开发提供了一站式解决方案.它包含了开发分布式应用程序所需的所有组件,使您可以轻松地使用springcloud开发 ...