背景图片在CSSClass里面到<div>

Background Image in CSS Class inside to <div>

我是网页设计的新手,我有一个问题想请教。我看不到背景图片。这是我的代码。我究竟做错了什么?我确定该图像位于正确的位置,并且我将 style.css 链接到我的 html 代码。

PHP:

<div style="main_div">
<div style="banner">


</div><!--banner end-->
</div><!--main end-->

CSS:

.main_div{width: 1000px; margin: auto;}

.banner{
width:100%; 
height:100%;
background-image: url(../img/bannerimg.png); 
margin-top:50px;}

我在 CSS 代码中也有 Eric Meyer 的重置代码。提前致谢。

您应该将 style 更改为 class,它应该可以工作。您的问题是您使用了错误的关键字。

  • class是识别元素
  • id是标识唯一元素
  • style就是在元素
  • 中写CSS

main_div class 高度并将 'style' 属性更改为 'class'。

.main_div {
    width: 1000px;
    height: 1000px;
    margin: auto;
}

您还可以设置background-repeat: no-repeat;让图片只显示一次。

<div class="main_div">
  <div class="banner">

  </div><!--banner end-->
</div><!--main end-->

.banner {
    width: 100%;
    height: 100%;
    background-image: url(../img/bannerimg.png);
    background-repeat: no-repeat;
    margin-top: 50px;
}