最近在一個項目中，測試同學提了一個bug，說手機上有個頁面的某些字體顯示偏大。就像這樣
我用chrome瀏覽器在pc上測試了一下，發現pc上也有這個問題，但是用其它瀏覽器打開這個頁面就沒有發現這個問題。
於是，上網百度了一下，發現原來是chrome瀏覽器的問題。
通過各種百度Google然后我總結了一下這個問題產生的原因：
chrome瀏覽器目前支持的最小的字體大小為12px，而我在html根元素上設置font-size:62.5%，計算之后就是10px，1rem=10px。
由於我頁面字體大小都是按照10px的基數去算的，所以當chrome瀏覽器計算字體大小時就出現了出錯。
解決方案：
又經過一番百度Google之后，總結了一下這種問題的解決方法。
網上提供的兩種最多的解決方案就是
1、js方法
<script type="text/javascript"> document.body.style.fontSize = '1.6rem'; </script>
具體的字號根據你的項目來決定
2、css方法
<style>
body {
font-size: 1.6rem;
}
</style>
將這個樣式插入到head標簽里面
這兩種方式我都試用了，但是並沒有效果，我也不清楚是怎么回事，如果有大神知道，還望不吝賜教。
所以，目前我認為最根本的解決方法就是，將html根元素的font-size大小設置為大於等於12px。
一些疑惑：
1、當1rem小於12px時，chrome是怎么計算的。
如上圖所示，我的html根元素的font-size設置為62.5%（10px），圖中字體計算的時候並不是25px，而是28.5941px，這個數是怎么來的，如果按照最小12px來算應該是30px才對啊。
2、為啥有的字體計算正確，有的出錯。
如上圖所示，同樣設置為2.5rem的字體，有的能正確計算出是25px，有的卻不行，這是怎么回事呢？
希望了解其中緣由的人能不吝賜教。