cover： 使頁面佔滿螢幕。
auto： 和 contain 選項表現一樣
safe-area-inset-left：安全區域距離左邊邊界距離
safe-area-inset-right：安全區域距離右邊邊界距離
safe-area-inset-top：安全區域距離頂部邊界距離
safe-area-inset-bottom：安全區域距離底部邊界距離
padding-bottom: constant(safe-area-inset-bottom);
/* 相容 ios < 11.2 */
padding-bottom: env(safe-area-inset-bottom);
/* 相容 ios >= 11.2 */
name="viewport"
content="width=device-width,
initial-scale=1.0,
minimum-scale=1.0,
maximum-scale=1.0,
user-scalable=no,
viewport-fit=cover"/>
只有設定了 viewport-fit=cover，才能使用 env()。
body如果元素是fixed定位且bottom不等於0，則只調整位置就可以了，增加margin-bottom或者改變bottom。
iPhone X全屏適配
當你的專案執行於iphone x模擬器的時候是否會出現以下這種情況？不能全屏，上下出現了大黑邊，受到以前在設定了啟動頁，把啟動頁刪除出現的上下黑框的啟發，於是想到只要給給iphone x設定乙個對應的啟動頁，就會實現全屏顯示。實現方法如下，首先開啟launchimage 我這裡啟動頁使用的launc...
新手機iPhone X適配
之前7月份開始忙著家裡裝修和換工作 一直沒有時間看iphone x的適配 今天抽時間看了看 順便分享給大家 請為你的應用提供高解析度的設計素材。iphone x 有非常高的解析度，請提供 3x 的設計素材。對於圖形類或其他扁平化影象素材，最好使用一倍尺寸下的 pdf 格式。適配 在你為 iphone...
使用 css 適配 iphoneX 劉海屏
iphonex 劉海螢幕導致 h5 頁面不能正常的全屏顯示了，就需要對 頁面進行適配，下面就詳細說說如何適配。首先上一張適配之前的圖 可以看到頁面頂部被遮擋，底部貼著最下面 ios11 增加新特性，增加webkit 的 css 函式，css 預定義變數 四個預定義變數為設定安全區域和邊界的距離，如下...