hotcss.js Flexible 移動端適配在dpr=2和dpr=3出現的字體大小設置不正確問題.

  這段時間一直在用hotcss作移動端適配,作了幾個頁面沒有發現什麼問題,後來老大要加快進度,我把項目分出一塊給另外一個同事作,她發現了一個問題就是字體在dpr=2,dpr=3,的設備上字體大小顯示總是不正確.

 

字體明明設置的是34px;computed完成以後恰恰顯示的是38.44px;比實際大了很多,而且查找了好多資料頁沒解決問題,

後來看了下別人的例子,像下邊這樣寫就會顯示正確.

,

 

加了max-height: 100%; display: block;這2個屬性忽然就行了.測試了下發現,只要將dom元素設置成能設置大小的元素就能夠,包括float:left;inline-block等,再加上max-height: 100%;就解決了.

雖然原理沒去研究,猜想應該是dpr縮放致使元素計算錯誤的.

 今天又研究了一下,發現只要將max-height: 100%; 加到body下,最高級的父元素問題就解決了,如圖:

 

這樣無論他下邊元素是什麼display格式的均可以,親測很是方便.
可是試了下加到body上不行.

過了這麼長時間,用以上方法解決後,發現這個問題又出現了,在安卓手機UC瀏覽器上字體大小仍是不正確,會變很大.

目前個人解決辦法是將元素的高度寫死,display爲inline-block,block.或者float:left;

發現此問題的朋友們能夠根據實際環境去調整.有誰發現更好的辦法.能夠在下方評論分享給你們.