利用vw做rem適配(純css)


vw:相對於視口的寬度。視口被均分為100單位的vw;
我在想,既然vw是相對於視口的寬度,又因為視口的寬度是不固定的,那么可以用vw來做到rem適配嗎?
下面是測試的截圖:
(如果是用手機看的,因為自動把圖片縮放了,所以看着字體大小一樣)

還有個問題,就是應該有個px與vw的換算比例吧,我又看了看。
假如ui圖的寬度為1920px,又因為vw會把寬度分為100份,那1vw=19.2px, 1920/100=19.2(px),現在這樣還是不行,不好算,那就算出每100px是多少vw, (100/19.2)*1=(約等於)5.21(vw),這樣,設根字體html為5.21vw,則0.18rem=18px
ok,還不錯,那么,如果要應用到項目中,因為是前端嘛,肯定要考慮到兼容性問題,以下是vw對瀏覽器的兼容:


 


免責聲明!

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



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