Question

我试图帮助修复朋友的网页。她花了800美元为她创建了一个网站，一旦它上升，他就反弹而没有使它与iOS Safari （正如他所承诺的）兼容。几个月后，她无法控制住这个家伙。所以，无论如何，我试图帮助她。 www.avasassi.com

我尝试修复视口标记
- 整个显示屏在iOS Safari中显示得太大
- 您无法正确缩小以查看该页面
- 她希望它正确加载，并以初始加载为中心
- 每个页面都有此问题
- 到目前为止，我只调整了index.hmtl和projects.html

original viewport tag是......

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

我尝试使用平庸的结果将其调整为this viewport tag

<meta name="viewport" content="width=device-width, initial-scale = 0.5" />

接下来是项目页面（projects.html）
- 显示以firefox和chrome为中心的各个图片，但在iPhone上的safari中显示
- 它偏离中心，并以某种方式将橙色条缩短，使其不会跨越整个页面
- 图片不以标题

这是项目页面图像的代码......

<section id="frame">
<div class="row1 cbox"><a class="samlink" href="saltysam.html"></a></div>
<div class="row2 cbox"><a class="spicelink" href="spicemates.html"></a></div>
<div class="row3 cbox"><a class="khloelink" href="khloe.html"></a></div>
<div class="row4 cbox"><a class="simonlink" href="simon.html"></a></div>
<div class="row5 cbox"><a class="thrivelink" href="thrive.html"></a></div>
</section>

CSS

#frame {
width: 450px;
height: 1850px;
margin: 0 auto;
position: relative;
display: block;

＆安培;

.cbox {
position: absolute;
overflow: hidden;
opacity: 1.0;
filter: alpha(opacity=100);
width: 450px;
margin: 0 auto;

非常感谢任何和所有帮助。欢呼声。

视口问题以iPhone和iPhone为中心iPad safari

0 个答案: