鍍金池/ 問答/HTML5  網(wǎng)絡安全  HTML/ h5頁面移動端用rem設置字體,字體不按照正常比例縮放

h5頁面移動端用rem設置字體,字體不按照正常比例縮放

項目中ui給到750px的設計圖
用rem布局 100px為1rem
設置黑色字體大小為.22rem 設置灰色字體為.16rem
在750的屏幕上字體,頁面布局正常。
圖片描述

但是,用谷歌瀏覽器手機模擬,到375的屏幕上,字體縮放有問題,并且,造成頁面布局紊亂
圖片描述

回答
編輯回答
嫑吢丕

chrome瀏覽器有12px的最小字體限制。

2018年1月17日 23:32
編輯回答
初念

你可以使用JS動態(tài)設置html的font-size, 來適應頁面分辨率的變化

2017年11月27日 15:37
編輯回答
純妹

使用 rem 布局,如果你想文字的大小隨著屏幕分辨率的改變而改變,可以使用媒體查詢 media 設置不同的 html 絕對大小的值

或者引入 lib-flexible ,不過這只是一種過渡方案,官方已經(jīng)不再推薦,轉(zhuǎn)而推薦使用 viewport 來替代此方案

2017年9月18日 17:28
編輯回答
不歸路

提供下viewport設置和html的fontsize設置看下

2018年8月31日 01:50
編輯回答
厭遇

用rem的情況下,屏幕尺寸變化,根標簽的font-size要重新計算啊

2018年4月19日 08:42