Question

我正在为iphone编写一个网站。我们的设计师将尺寸为320 x 480的图像传递给我，因此我也根据该尺寸对网络进行编码。但是当我在我的iPhone上预览时，网站看起来很小。如何解决这个问题？

我的容器大小是320px。

感谢。

Answer 1

尝试将以下元元素添加到标题中：

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

然后将容器宽度设置为100％。 Safari最初支持此标记，但现在许多其他移动浏览器都支持它。

请注意，如果用户将其设备旋转到横向视角，则宽度将为480px。如果您打算让用户将设备保持在纵向模式，您可以将设备宽度设置更改为320。

Answer 2

在

的顶部试试这个

<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd">
...and on your body

<div style="width: 320px; margin: 0 auto;"> 
<!--some code here-->
</div>

然后你可以在http://testiphone.com/ ...

进行测试

Answer 3

使用此代码：

<div style="width: 100%; margin: 0 auto;"> 
<!--put other code here-->
</div>

为iPhone设计网站

3 个答案: