如何寫移動端自適應?

2021-09-12 22:21:32 字數 287 閱讀 7186

1、使用rem單位去替換px單位,布局模板以寬為320px移動端來布局;

2、因為rem單位是以html根元素的font-size為標準換算的,所以,隨著螢幕的尺寸越大,而font-size始終為320px時所定的畫素(這裡採用html的font-size為20px方便計算),且移動端尺寸變大html的font-size不會跟著變大,所以,我們所計算出來的元素尺寸是不會跟著變化的,這時,我們需要去檢測裝置根據裝置的尺寸去重設html的font-size的以適應其他移動端的尺寸。。。

這時我這段時間做專案得到的結論。。。。。。。

移動端自適應

1 js動態設定html的字型大小 var clientwidth 0 if document.documentelement.clientwidth 600 else document.documentelement.style.fontsize 50 clientwidth 375 px win...

移動端自適應

width device width width為設定layout viewport 的寬度,為乙個正整數,width device 表示寬度是裝置螢幕的寬度 initial scale 1.0 initial scale為設定頁面的初始縮放值,可以是乙個帶小數的數字,1.0就是佔網頁的100 mi...

寫移動端自適應螢幕的方法

前端移動端開發的時候肯定是會面對不同型號的手機的頁面展示問題的,今天給大家推出另外一種自適應不同移動端的方法,使用vw,vh單位。vw和vh單位的大小是多少?vw和vh是根據裝置的寬度和高度來決定的,裝置的寬就是100vw,裝置的高就是100vh,你設定的50vw就是相當於裝置寬度的50 你設定的1...