基于dataV框架的⼤屏项⽬针对QQ浏览器rem适配问题
项⽬场景:
公司要求做⼀个数据可视化⼤屏项⽬,初次接触简单写写(第⼀次写,可能描述的不太准确)。
问题描述:
今天遇到qq浏览器出现罢⼯问题(rem设置后尺⼨偏⼤,导致⽹页放⼤了)⾕歌,⽕狐。我之前的的font-size是这样设置的:
ui给的设计稿是1920*1080(为了偷懒我直接设置fontsize=10px 即:1rem=10px)
原因分析:
起初我以为QQ浏览器之所以不适配,是因为QQ浏览器对rem计算⽅法有差异,实际上是这些浏览器当根标签html字体⼩于12px时,按照12px绘制,即我根元素即使改成10px,元素设置10rem,被算成12*10 =120px;
数据可视化大屏设计解决⽅案:
你只需要讲你设置的根元素fontsize写⼤⼀些就可以了,我⼲脆直接放⼤⼗倍 1rem=100px;(最后,最重要的是别忘了把你之前写的基于原来fontsize就算出来的rem值 除以10就解决了)
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论