一：本文提供兩種解決方案 1.終端解決方案（最優，建議選擇） 2.web解決方案 導語: iPhone X的出現，一方面對於整個手機行業的發展極具創新領頭羊的作用，另一方面也對現有業務的頁面適配帶來了新的挑戰。 對於手Q中的各業務來說，受iPhone X影響的H5頁面挺多，應該采取 ...

1.rem 上述代碼，便是屏幕適配的整個框架，可以適用手機，平板，電腦。 可以在其中寫入自己的代碼，以rem為單位（此代碼1rem=20px）； 有縮放效果，以px為單位，是絕對值，不會隨着屏幕大小的改變，而改變； 以百分比為單位，注意將標簽的所有父元素都已百分比為單位，同樣 ...

h5 移動端適配方案 設定viewport 打開public\index.html，在html\head結點下加入<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale ...

安全區域？ 安全區域指的是一個可視窗口范圍，處於安全區域的內容不受圓角（corners）、齊劉海（sensor housing）、小黑條（Home Indicator）影響，如下圖藍色區域： 也就是說，我們要做好適配，必須保證頁面可視、可操作區域是在安全區域內。 更詳細說明，參考文檔 ...

一、相信大家有被iPhone X底部黑色橫線支配的恐懼 　　上面我們可以看到，底部的導航欄被一條黑色橫線所蓋住，那么就很煩。下面我們可以開始進行適配環節 　1、首先我們可以用 JS 判斷手機環境是不是 iPhone X 代碼如下 2、也可以 CSS 判斷 ...

一、前言 昨天嘮叨了哈沒用的，今天說點有用的把。先說一下響應式布局吧，我一直認為響應式布局的分項目，一下布局簡單得項目做響應式還是可以可以得。例如博客、后台管理系統等。但是有些會認為 ...

《使用Flexible實現手淘H5頁面的終端適配》：https://github.com/amfe/article/issues/17 《再聊移動端頁面的適配》：https://blog.csdn.net/qq_21729177/article/details/79466951 《如何在Vue ...

前言 移動互聯網發展至今，各種移動設備應運而生，但它們的物理分辨率可以說是五花八門，一般情況UI會為我們提供375尺寸的設計稿，所以為了讓H5頁面能夠在這些不同的設備上盡量表現的一致，前端工程師就不得不對頁面進行移動端適配了。 「如果這篇文章有幫助到你，❤️關注+點贊❤️鼓勵一下作者，文章公眾 ...