1

在把我所有的头发都拉出来之后，它已经归结为这个最小的 html 页面，它似乎在 iOS 上呈现错误：

<!doctype html>
<html>
<head>

<style type="text/css">

#fold
{
    background:url(https://s3.amazonaws.com/gigantt_pub_imgs/2012/07/1342078193.png) top left;
    min-height:350px;
}


#features
{
    background:url(https://s3.amazonaws.com/gigantt_pub_imgs/2012/07/1342078193.png) top left;
    min-height:350px;       
}   
</style>
</head>
<body>
    <div id="fold">
    </div>
    <div id="features">

    </div>
</body>
</html>

在 iOS 中查看时（或者在 iOS 模拟器中），您可以在两个蓝色 div 之间看到一条线。

在此处输入图像描述

如果放大，这条白线会消失。当然，它在我尝试过的任何其他桌面浏览器中也不可见。

所以，我是疯了还是其他人得到了这个？知道如何解决它吗？

4

1 回答 1

3

它可以被解释为一个错误（我认为是）——但它与iOS 处理背景图像的方式有关。

快速回答 - 为您的元素之一添加负边距。请参阅此 JSFiddle。

相关部分是这样的：

#features
{
    background:url(https://s3.amazonaws.com/gigantt_pub_imgs/2012/07/1342078193.png) top left;
    min-height:350px;
    margin-top: -2px;    
}

您可以使用媒体查询来定位它。

于 2012-07-12T13:32:20.067 回答