-1

我正在寻找在页面中包含标题的方法,我遇到了这个网站:(见下图)它完全符合我的要求,但我不知道如何完成它。我遇到的问题是顶部只有一个标题图像而不会重复到底部。我在主 div 上使用了 css background-image:url(image) 但存在重复图像问题。任何有关此事的帮助或见解将不胜感激。

编辑:我需要其余的背景重复直到结束。我认为让背景的其余部分成为单独的图像可能是解决方案的一部分,但我不知道是否可以将标题图像 div 强制到同一层。同样,任何见解都是有价值的,因为我是 HTML 和 CSS 的新手。这也是我能找到的最好的示例网站,如果你被冒犯了,请用更好的示例进行编辑。谢谢你!

在此处输入图像描述

4

2 回答 2

1
background-repeat:no-repeat;

这是不重复背景图像的 css 技巧。

如果你还不知道这一点,你怎么能进入这个网站?

来自你的链接

body {
  background: none repeat scroll 0 0 #000000;
  color: #FFFFFF;
  font-family: Helvetica,Arial,sans-serif;
  margin: 0;
  padding: 0;
}
#wrapper {
  background: url("/marines-theme/images/layout/body-background.jpg") repeat-x scroll left 23px rgba(0, 0, 0, 0);
  margin: 0 auto;
  min-width: 980px;
  overflow-x: hidden;
}
#overview-wrap {
  background: url("/image/image_gallery?uuid=a394504c-a638-449e-bb56-b517cfe7d3ee&groupId=10162&t=1349957392552") no-repeat scroll center top #000000;
}

这些是嵌套标记,如下所示:

<body>
    <div id="wrapper">
        <div id="overview-wrap"></div>
    </div>
</body>

就是这样。

附言。我添加了您要显示的屏幕截图。您可以删除(现在无用的)链接吗?

于 2013-11-13T17:53:33.477 回答
1

你可以使用下面的 CSS 来完成它,

#elemId
{
 background: #00ff00 url('testimage.jpg') no-repeat top left;
} 

希望它会有所帮助

于 2013-11-13T18:48:32.063 回答