Question

我想创建一个像app一样的网站。它非常简单，但我仍然无法弄明白如何让它工作......

它基本上是一个从主屏幕启动应用程序时显示的图像（我需要以某种方式使地址和导航栏消失）。当您单击图像时，它应该显示下一个图像。

我试过这行代码

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

<!-- this is the part responsible for hidding the bottom bar -->
<meta name="apple-mobile-web-app-capable" content="yes" />

<meta names="apple-mobile-web-app-status-bar-style" content="black-translucent" />
    <link rel="apple-touch-icon" href="images/template/engage.png"/>

并且图像编码如下

    <a href="xxx.html">
<img src="xxxx.png"/>
</a>

但问题是图像的尺寸没有调整到iphone屏幕，它们变得更大，所以你必须滚动才能看到整个画面。

此外，每当按下图像链接时，将打开一个新的野生动物园窗口并包含野生动物园导航栏＆amp;地址字段。

任何人都知道如何才能使这项工作？

提前致谢..

Answer 1

您可以在css中设置图像的最大宽度，以避免图像比当前窗口宽：

img { max-width: 100%; }

您可能需要考虑使用css框架，例如Bootstrap或Foundation。它可以帮助您更轻松地创建响应/移动友好的网站，尤其是它们的网格系统和响应式ui元素。

Answer 2

尝试使用css样式

img{
  max-width: 100%;
}

EDIT 对不起，我赶时间。）

iPhone优化的2页“app”（网站）

2 个答案: