我不是在谈论页面缩放,而是iOS上的MobileSafari自动增加某些字体大小的方式。
究竟在什么情况下会自动增加字体大小?是否可以防止或减少这种情况的发生?
我不是在谈论页面缩放,而是iOS上的MobileSafari自动增加某些字体大小的方式。
究竟在什么情况下会自动增加字体大小?是否可以防止或减少这种情况的发生?
body {
-webkit-text-size-adjust: 100%;
}
确保您的所有文本在第一次呈现时都以易读的字号显示。请记住,iPhone和iPod touch屏幕相对较小。
body
中;如果你想为 iPhone 使用它,应该将其放在一个 320px 的设备宽度媒体查询中。 - mk12我遇到了很多跟踪的麻烦,但问题是CSS中的-webkit-text-size-adjust
属性。
值:
120%
或100%
auto
(默认值)none
- 如果auto
在您的页面上不起作用。然而,这通常会导致缩放问题。请改用100%
。例如,在桌面上打开Safari并缩放页面(Command-Plus)时,尽管整个页面已缩放,但您的文本不会变大。请勿使用none
!请注意,这些属性不仅可以应用于页面级别,还可以应用于元素/小部件/容器级别。
(除非我非常确定它已经针对小屏幕进行了优化,否则我不会为我的网站指定100%
的值,并且永远不要使用none
,因为它会导致问题。)
请注意,在Firefox移动版(例如Android和Firefox OS)中,有一个类似的属性 -moz-text-size-adjust
,可以在此处查看文档。感谢Costa指出这一点。
更新,十年后:此MDN页面可能是检查当前浏览器兼容性和供应商前缀的最佳方法。
接受的答案是可行的,但在其他webkit浏览器中,对于正在缩放的用户,它锁定了font-size
。而使用100%
而不是none则可以同时适用:
body {
-webkit-text-size-adjust: 100%;
}
none
)相同,而你却建议使用 100%
? - Alan H.