重复身体背景图像下方的空白区域答案

【问题标题】：White Space below repeated body background image重复身体背景图像下方的空白区域
【发布时间】：2012-07-27 02:42:34
【问题描述】：

我是编程界的新手，我一直在尝试尝试了解更多信息。我正在使用静态 html i-frame 应用程序创建一个自定义 facebook 选项卡，并且在垂直重复正文背景图像时一直遇到问题。由于某种原因，我无法弄清楚，图像与重复图像之间有一个白色间隙。任何帮助将不胜感激！

代码如下：

    body {
    background-image:url('http://i1187.photobucket.com/albums/z389/mawler023/FBTabBody.png');
    margin:0;
    padding:0;
    background-position:right top;
    background-attachment: fixed;
    background-repeat:repeat-y;
    width:810px; 
    color: #333333;
    font-family: Verdana, Geneva, sans-serif;
    }`

【问题讨论】：

为我们设置一个 jsfiddle 或者给出问题页面的链接。

标签： html css image background

【解决方案1】：

您正在使用的图片 (http://i1187.photobucket.com/albums/z389/mawler023/FBTabBody.png) 顶部有一条白色带（粗略测量说它的高度约为 123px ）。这将在每次重复导致您观察到的差距时显示出来。

您只需要修剪图像，它应该会消除间隙。

如果你想在页面顶部有一个白色区域（但不是重复），你最好要么减少应用背景的区域，要么在顶部的元素上放置一个明确的白色背景。

【讨论】：

【解决方案2】：

因为图像本身在顶部有一个巨大的空白

【讨论】：