用CSS里的 viewport-fit 标签应对iPhone X 的刘海
iPhone X 配备一个覆盖整个手机的全面屏，顶部的“刘海”为相机和其他组件留出了空间。然而结果就是会出现一些尴尬的情景：网站被限制在一个“安全区域”，在两侧边缘会出现白条儿。移除这个白条儿也不难，给 body 设置一个 background-color 就可以搞定 ...
原文：兼容iphone x刘海的正确姿势
在 ios 中我们可以使用 viewport fit cover safe area inset 。 那么是不是 ios 以下就用不了这些了呢 是的，但你见过 iphone x 有 ios 以下的吗 所以我们可以愉快的搞下去。 开始之前我们先了解什么是 safe area，简单的来说就是除了刘海和胡子以外的区域为安全区域： 关于 viewport fit viewport fit 有 个值：con ...
2018-11-14 10:17 0 918 推荐指数：
相关推荐
HttpClient(4.5.x)正确的使用姿势
前言: httpclient(4.5.x)默认是启动连接池的, 其降低时耗(避免连接初3次握手, 以及关闭4次握手的消耗), 显著提升高并发处理能力(大量减少time_wait), 确实扮演了重要的角色. 但是封装httpclient, 需要了解不少细节, 还要根据业务合理配置参数 ...
兼容IE8的input输入框的正确使用姿势
input是一个很常见的标签，大家使用的也很常见，但是我在具体的工作中发现要想完美的使用这个标签还是任重而道远，下面是我碰到的几个问题。 1、我们在使用这个标签的时候会习惯的加上placeholde ...
vue 刘海屏兼容组件
/* 无返回按钮的标头 */ <template> <div v-if="GLOBAL.evnType === GLOBAL.ENV_TY ...
IdentityServer4 4.x版本 配置Scope的正确姿势
前言 IdentityServer4 是为ASP.NET Core系列量身打造的一款基于 OpenID Connect 和 OAuth 2.0 认证的框架 IdentityServer4 ...
关于 iphone H5刘海屏适配
默认刘海屏的webview是有安全区域的，加上viewport-fit=cover属性后webview会全屏，全屏后为了适配刘海屏加上安全区域 padding-top: 1rem;//android样式 padding: env(safe-area-inset-top ...
微信小程序iPhone X空白兼容
开局一张图…… 看看这空白的地方多丑 ~ 接下来就是见证奇迹的时刻（上代码） index.js中的代码 wxss中的代码 ...
React Native 调用 Web3（1.x） 的正确姿势
安装加密用包 安装兼容工具 link ...