iPhone的字体大小问题 [英] Font size issue with iPhone

问题描述

我目前正在使用移动版网站，一切都很棒，可在iPhone，黑莓和Android上正常工作。

我有一个小问题，一个很大的交易，但还是有点恼人。我有：

< h1> 标记设置为18像素和bold
< h2> 标记设为12像素和bold_HTML
< p> 12px and normal

现在，当以纵向方式观看时，iPhone上的一切看起来都很不错，但是当设备旋转到< h1> / code>标题变小了（难以辨别但可能小于< 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; 
} 
 $ b bp {
 color：＃333333; 
 font-size：12px; 
 line-height：18px; 
 font-weight：normal; 
} 
 
我相信你是在你的CSS中寻找这个：
 
 
 
  html {
 -webkit-text-size-adjust：none; / *禁止横向缩放字体* / 
} 
  
 
Im currently working on a mobile version of a website, everything is great, works fine on an iPhone, Blackberry and Android.

I have one slight problem, not a big deal but still a little annoying. I have:

<h1> tags set to 18px and bold

<h2> tags set to 12px and bold

<p> tags set to 12px and normal

Now everything looks great on the iPhone when viewing in portrait, but when the device is rotated to landscape the <h1> titles go smaller (hard to tell but possibly smaller than the <h2> tags?!

Here is my 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;
}

解决方案
I believe you are looking for this in your CSS:
html {
    -webkit-text-size-adjust: none; /* Prevent font scaling in landscape */
}


                        
这篇关于iPhone的字体大小问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！