移動端viewport下px與rem的衝突

碰到了一個頭疼的問題,我們的頁面是兩倍製作的,爲的是更好適應不同的屏幕尺寸。

但是某些情況下,移動端瀏覽器不讓整體縮放頁面,這就導致我們的頁面顯示會爆裂太大。

由於業務迭代關係,我們的部分頁面,使用了px作爲尺寸單位,包括文字也是。這就導致這種問題的產生。

經過多方查找,最好的解決辦法就是將px單位換算成rem

px是固定單位像素

rem是相對單位,相對於最外城的font-size

這裏我們要 換到的 css樣式很多,手動計算耗時太嚴重。經過多方搜尋,我們找到了下面的工具,推薦給大家。

https://520ued.com/tools/rem

這個功能太棒了,上面注意設置自己的html font-size 係數即可,超級好用。