參考文章:
在meta標籤中設定viewport-fit=cover
name
="viewport"
content
="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover"
>
safe-area-inset-top、safe-area-inset-left、safe-area-inset-right、safe-area-inset-bottom獲取四個方向的安全區域，適配底部則需要用到safe-area-inset-bottom
需要使用env()函式取值
.body
constant()是ios11.2之前的適配版本，11.2以上已經不再支援
如果頁面已經設定過內邊距，可以使用calc()函式搞定
.body
env()可以寫第二個引數，如果環境變數不可用，該引數可讓您設定備用值
.body
H5 密碼 調起安全鍵盤 導致頁面底部出現留白
首先嘗試通用解決方式，如 實踐上述型別的解決方式，仍不穩定，經多次測試發現，全部是在輸入密碼時，安全鍵盤頂起頁面導致頁面出現留白。猜測是系統預設安全鍵盤的問題，無法感應到鍵盤收起，使頁面下滑。在同事的vivo上也出現類似的問題，考慮到多種機型的相容性問題，所以決定繞過input type passw...
關於H5移動端開發 iPhone X適配
一 查詢 media screen and device width 375px and device height 812px mui content 二 ios11 新增特性，蘋果公司為了適配 iphonex 對現有 viewport meta 標籤的乙個擴充套件，用於設定網頁在可視視窗的布局方...
iphoneX適配 客戶端H5頁面
1 頂部通欄 之前的客戶端一直採用狀態列20pt 導航欄44pt的做法。由於iphonex多了一塊小劉海，因此iphonex單獨採用狀態列44pt 導航欄44pt，意味著內嵌的h5頁面整體下移24pt。2 底部操作欄 由於iphonex是全面屏，頁面最底部會被彎曲的拐角截掉一部分，特別是有底部固定懸...