今天下午,测试小姐姐突然跟我反馈了一个奇怪的bug,大概就是在她的mac自带的显示器上,网页的字体很小,但将网页拖到外接的显示器上,又显示正常了
这么神奇,我马上打开项目,发现自己这边是显示正常的,然后去ui小姐姐的电脑上看,也没有问题,她的电脑是20款的mac,我的是2019款的mac,测试小姐姐的是今年新买的mac,初步怀疑是今年新款的m2芯片的问题。
既然有问题,那得想办法解决了,因为看到同个页面中,其他字体是显示正常,我初步怀疑是我之前偷懒,没给标签写死字号的原因,打开控制台,查看元素,发现我是这么写的
强制给h6标签加上font-size: 0.12rem; git推送,jenkins打包发布,一气呵成。然后跑去测试小姐姐电脑上,刷新一看,好了。
总结:去谷歌了一下,也没发现有什么说法,也没看到网上有人反馈这种问题,猜测可能还是跟苹果新款m2芯片兼容性相关吧,然后又去查了下h6默认字号的大小,给出的解释是如果浏览器body的字体16px,那么:
h1=32px
h2=24px
h3=18.72px
h4=16px
p=16px
h5=13.28px
h6=12px
我初始化的时候,是这样写的
body给的是14px,如果是这样的话,那h6应该默认是10px左右(但字体看起来好像是8px字号的大小)而且在外接4K显示器一直都是正常显示的。
最终解决的办法就是给标签写上font-size就欧了。原因目前还不明。