1.先談一下響應式和自適應的區別
響應式：它是將已有的開發技巧（彈性網格布局、彈性、**和**查詢）整合起來，針對任意裝置對網頁內容進行「完美」布局的一種顯示機制。簡言之，是乙個**能夠相容多個終端（手機、pad、電腦）的布局方法，而不需要為每個終端書寫一套特定版本的**。
自適應：移動端的發展帶來了自適應布局。通過js及css的控制，借助rem、百分比等相對度量單位，讓**在多種解析度的移動端正常呈現。自適應布局，是當前移動端實現網頁布局的最常用的布局方法，需要綜合使用多種知識。
2.想要移動端各個機型下都能完美顯示，首先想到的方法就是自適應的rem/百分比，現在一般手機版的設計稿會按750px作為乙個標準尺寸，以下為rem.js（750px下100px=1rem）
//根據螢幕設定html字型
(function
(doc, win)
}; if (!doc.addeventlistener) return
; win.addeventlistener(resizeevt, recalc,
false
); doc.addeventlistener('domcontentloaded', recalc, false
);})(document, window);
3.想要完美顯示750px到1920px內容，有兩種方案：
一、bootstrap的柵格布局思想（此方案適用於列表項展示的柵格化內容展示）；
二、**查詢（將此區間的解析度分為幾個區間，每個區間設定不同的寬、高、字型大小等內容）
@media only screen and (max-width: 768px) @media only screen and (min-width: 769px) and (max-width: 1000px) @media only screen and (min-width: 1001px) and (max-width: 1440px) @media only screen and (min-width: 1440px) and (max-width: 1920px)
4.最後將步驟2和3結合起來使用，即768px下以750px為標準使用rem單位，768px以上分區間處理或柵格處理
個人拙見，忘不吝賜教
從0開始搭建vue移動端
建立專案 全域性安裝vue cli npm install g vue cli 建立專案 vue init webpack vue demo如果出現vue 不是內部或外部命令，也不是可執行的程式 或批處理檔案 在main.js中引入flexible.js檔案 flexible.js function...
移動端的meta viewport
什麼是viewport 手機瀏覽器是把頁面放在乙個虛擬的 視窗 viewport 中，通常這個虛擬的 視窗 viewport 比螢幕寬，這樣就不用把每個網頁擠到很小的視窗中 這樣會破壞沒有針對手機瀏覽器優化的網頁的布局 使用者可以通過平移和縮放來看網頁的不同部分。移動版的 safari 瀏覽器最新引...
移動端的優化
width device width initial scale 1.0 maximum scale 1.0 user scalable 0 name viewport yes name 第二個meta標籤是iphone裝置中的safari私有meta標籤，它表示 允許全屏模式瀏覽 black na...