在每页CSS顶部插入横幅图像

Question

我正在学习如何创建一个网站，我偶然发现了一个我无法弄清楚的问题。我想在网站的每个网页页面的顶部放置一个横幅，我想知道是否可以使用.CSS完成此操作。我已经在.CSS上有一个背景但我似乎无法在顶部正确插入图片。这是我的代码：

 hr {color:sienna;}
 p {margin-left:20px;}
 body {
 background-image:url("pic2.png");
 }

然后我会在每个页面上调用它（例如css文件名是style.css）：

  <link rel="stylesheet" type="text/css" href="style.css">

Answer 1

喜欢这个......？

JS小提琴：http://jsfiddle.net/SinisterSystems/Yd4d6/

<div id="banner"></div>
<div id="content">
    Hello world
</div>

#banner {
    background:url('http://sweetclipart.com/multisite/sweetclipart/files/imagecache/middle/banner_white.png');
    width:100%;
    min-height:189px;
}

或者您是否希望它将该元素动态应用于您的页面？

---

为了进一步了解，我们需要更多数据：

• 你的横幅会不会是静态的，也就是说，总是大小相同？
• 这会出现在每个页面上，你是否希望它只是放入DOM？

如果您尝试添加元素到您的网页， CSS 只允许使用您网页上的现有元素执行pseudo operations。

Answer 2

我在你的代码中发现了一个语法错误。

你只能使用

background-image:url("pic2.png");
background-repeat:repeat;

或

background:url("pic2.png") repeat;