我在使用简单的CSS-Layout时遇到了麻烦.它适用于桌面浏览器,但不适用于iPhone的Mobile Safari.使用style ="float:right"似乎与Mobile Safari自动调整字体大小相冲突.以下代码在桌面上工作正常但在iPhone上"左"和"跟随文本"比"右"大得多:
LeftRightFollowing text
似乎Mobile Safari的自动调整大小并没有触及浮动的单词,只触及其他单词.如前所述在这里,我可以添加-webkit-text-size-adjust: 100%
像这样:
LeftRightFollowing text
但我想保留Mobile Safari在字体大小和可读性方面的聪明才智.我试图避免为不同的屏幕尺寸编写特殊布局.
那么在同一行文本中是否有更多iOS友好的左右对齐单词方式?
WebKit有一个恼人的功能(对于一个设计合理的响应站点)试图放大屏幕上"主要"文本的字体,其中主要是最好的猜测.一旦浮动某些文本,它就不再被视为"主要"内容,因此它没有应用自动缩放.
您可以使用以下命令禁用此行为
body { text-size-adjust: 100%; -ms-text-size-adjust: 100%; -moz-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; }
这仍然是一个实验性的财产.
您应该将此与响应式设计结合使用,以便为小屏幕设备的用户适当地缩放内容.
注意:不要使用none
; 这会导致旧的webkit桌面浏览器中出现错误,导致它们禁用文本缩放.