0

I have simple html page with body and header elements:

<body>
    <header class="logoBar"></header>
</body>

I try to add background image to header. If i do:

.logoBar {
   background:url('http://img704.imageshack.us/img704/2162/67726065.jpg') repeat-x center top;
}

It doesn't show image. But if i make:

body {
    background:url('http://img704.imageshack.us/img704/2162/67726065.jpg') repeat-x center top;
}

I see image. Why doesn't it work for header?

Thank you.

4

3 回答 3

1

您必须为标题设置一个width和height。如果它没有内容，它将只是 0px 宽和 0px 高。

.logoBar {
   background:url('http://img704.imageshack.us/img704/2162/67726065.jpg') repeat-x center top;
   width: 900px;
   height: 300px;
}

演示：http: //jsfiddle.net/Zjczp/

于 2013-04-12T11:13:05.103 回答
1

尝试在标题元素的 css 上设置宽度和高度。

.logoBar {
   width: 100%;
   height: 250px; <!-- Your image height goes here...
   background:url('http://img704.imageshack.us/img704/2162/67726065.jpg') repeat-x center top;
}
于 2013-04-12T11:13:25.477 回答
0

现在定义你的班级的价值.logobar

像这样 

.logobar{display:block;}

并且定义width和height 根据 @WDffy和@Cristy

于 2013-04-12T11:37:36.343 回答