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;

发现此问题的朋友们能够根据实际环境去调整.有谁发现更好的办法.能够在下方评论分享给你们.