手机兼容【手机显示与电脑(或指定)的显示不一致】

时间:2022-09-08 19:04:27

1.字体的显示大小,与在CSS中指定的大小不一致

手机兼容【手机显示与电脑(或指定)的显示不一致】在google浏览器,手机状态查看的


发生原因:

Webkit 给移动端浏览器提供的一个特性【「Font Boosting」又称「Text Autosizer」、「Font Inflation」】


解决方法:                

由于Font Boosting 仅在未限定尺寸的文本流中有效,故给元素指定宽高,使用固定宽高,有一定的局限性,故使用max-height ,min-height, min-width, max-width【其中只有max-height有效】


具体代码:

p { max-height: 100%; }


补充:


手机兼容【手机显示与电脑(或指定)的显示不一致】

在iphone中出现右边空白
而其他浏览器正常显示。
也可以考虑使用
p{max-heihgt:100%}解决