字体大小与iPhone的问题
我目前正在使用移动版本的网站,一切都很好,在iPhone,黑莓和Android上都能正常工作。字体大小与iPhone的问题
我有一个轻微的问题,没有什么大不了的,但仍然有点烦人。我有:
<h1>
标签设置为18像素,大胆<h2>
标签设置为12像素,大胆<p>
标签设置为12像素,并在纵向观看时在iPhone上正常
现在一切都看起来不错,但是当该设备旋转为横向的<h1>
冠军去更小的(很难说,但有可能比<h2>
标签?
这里小是我的CSS:
h1 {
color:#FFFFFF;
font-size:18px;
line-height:22px;
font-weight:bold;
margin-top:0px;
}
h2 {
font-size:12px;
color:#333333;
font-weight:bold;
margin-bottom:-5px;
}
p {
color:#333333;
font-size:12px;
line-height:18px;
font-weight:normal;
}
我相信你在你的CSS寻找这样的:
html {
-webkit-text-size-adjust: none; /* Prevent font scaling in landscape */
}
完美的作品!欢呼声,应尽快将答案标记为正确! – Ryano 2010-08-12 09:51:09
谢谢!!!!!! – 2011-09-01 07:17:30
No problemo dude! – 2011-09-02 09:03:33
正如Neurofluxation的回答说,你可以使用CSS规则-webkit-文字大小调整,但要注意,这可以防止用户调整桌面Webkit上的字体大小(更多详细信息,请参阅this article)。
鉴于此,可能值得通过CSS3媒体查询(或用户代理)检查是否安全。
例如,
@media only screen and (max-device-width: 480px) {
html {
-webkit-text-size-adjust: none;
}
}
一个更好的解决方案可以使用100%,而不是没有,作为一个老线程通过user612626指出: Font size rendering inconsistencies on an iPhone
body {
-webkit-text-size-adjust: 100%;
}
这样桌面WebKit浏览器可以调整大小和缩放比例也是如此。 我认为这是比屏幕尺寸过滤更好的方法。
希望它有帮助。
[当iPhone的方向从纵向变为横向时保留HTML字体大小]的可能重复(http://*.com/questions/2710764/preserve-html-font-size-when-iphone-orientation-changes-从肖像到景观) – Blazemonger 2012-05-30 22:09:29