为什么会出现在iOS上的Safari相邻的DIV之间的可见差距？(Why is there a vi

2019-10-17 00:25发布

站内文章 / 移动开发
37 0 0

拉着我的头发后，它已回落到，这似乎是在iOS上渲染错误这个最小的html页面： 

<!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之间出现了一阵线上。

如果您在放大这种白线就会消失。当然，这是不以任何其他桌面浏览器我试过，无论是可见的。

所以，我是不是要疯了，或者其他任何人得到这个？ 任何想法如何解决呢？

Answer 1:

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

简单的回答 - 增加阴性切缘来你的元素之一。 看到这个的jsfiddle 。

相关的部分是这样的： 

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

您可以针对这一点使用媒体查询。



文章来源: Why is there a visible gap between adjacent DIVs on iOS Safari?
标签： html css mobile-safari
举报

收藏的人(0)

Ta的文章 更多文章
登录 后发表评论
0条评论
还没有人评论过~