为什么字体(和其他元素)在移动设备上显得如此之小

Question

我正在尝试为移动设备创建一个特殊的样式表(例如 - iphone).

我在主样式表中有这样的规则:

body
{
    font-family: arial,georgia,"times new roman",times,serif;
    font-size: 12px;
    line-height: 18px;
}

并且对于某个标题:(除了定义全部的主体外,我的所有字体大小都在em中)

#header #PageTitle h1{
    font-size: 4.5em;
}

当我看到我的iPhone上的大标题时,它看起来很安静 - 我应该怎么做才能看到更大的尺寸？我怎样才能将规则的所有元素应用到"只是两倍大"(我尝试调整体型的字体大小,但这不起作用).

我做错了什么,怎么做得正确？

Answer 1

我发现这段代码禁用了iphone中的缩放:

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />

我不确定这是否是确切的解决方案(并且它使一切看起来都太大了) - 但这只有一半......

Answer 2

所以,两倍大: -webkit-text-size-adjust: 200%;