大名鼎鼎的flexible
原理：flexible.js正是利用rem單位相對根元素的font-size來做計算，而我們需要做的就是根據不同的螢幕算出html的font-size，而頁面內的大小單位都根據rem來寫，從而實現了自適應。
假設拿到的設計稿和上述網易的一樣都是750，flexible會把設計稿分為10份，可以理解為頁面width=10rem，即1rem=75px，所以根font-size（基準值）=75px。之後的css換算rem公式為：
px/75=rem,所以100px=100/75=1.33rem,50px=50/75=0.66rem
前端介面的rem適配換算
為什麼要使用rem 之前有些適配做法，是通過js動態計算viewport的縮放值 initial scale 例如以螢幕320畫素為基準，設定1，那螢幕375畫素就是375 320 1.18以此類推。但直接這樣強制頁面縮放過於粗暴，會導致頁面文字失真模糊。px是相對固定單位，字型大小大小直接被定死，...
前端頁面適配的rem換算
之前有些適配做法，是通過js動態計算viewport的縮放值 initial scale 例如以螢幕320畫素為基準，設定1，那螢幕375畫素就是375 320 1.18以此類推。但直接這樣強制頁面縮放過於粗暴，會導致頁面文字失真模糊。px是相對固定單位，字型大小大小直接被定死，所以使用者無法根據自...
前端手機頁面的適配css
我之前一直不知道同乙個網頁，手機頁面和pc頁面，怎麼呈現出不同的效果呢？這個不同，不是說放大縮小的那種不同，而是布局就不同了。media only screen and max width 767px 顧名思義，最大不超過767px寬的螢幕適用以下css 這裡可以舉個例子 pc端 手機端 但是這裡有...