移動端h5頁面適配rem


前言:前端頁面的布局(各元素的間距),一般會有PSD文件,有精確的px單位,而px與rem要如何轉換才能高度還原設計圖呢
一般情況下,設計稿的寬高為: 750*1334px,而大部分流行手機的屏幕尺寸為: 375*667px,正好是一倍的關系。
手機瀏覽器的根字體大小是16px,所以這里的baseSize設為32最好,因為正好是16的2倍,所以設計稿里的數值為多少px,代碼就直接寫多少px就行了。
高度還原設計圖,提高工作效率,是皆大歡喜的。
當然,前提要安裝能將我們寫的px轉換為rem的插件,可參考 https://www.jianshu.com/p/dcba77b3f5a2
如圖所示,不同手機屏幕尺寸適配后的效果


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM