<div> 内的 CSS 类中的背景图像答案

【问题标题】：Background Image in CSS Class inside to <div><div> 内的 CSS 类中的背景图像
【发布时间】：2018-10-25 21:50:23
【问题描述】：

我是网页设计的新手，我有一个问题要问。我看不到背景图片。这是我的代码。我究竟做错了什么？我确信图像在正确的位置，并且我将 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 的重置代码。提前致谢。

【问题讨论】：

main_div 需要一个 height 值。您的 div 中没有提高高度的内容。

标签： html css class background stylesheet

【解决方案1】：

为main_div 类指定一个高度，并将“样式”属性改为“类”。

.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;
}

【讨论】：

【解决方案2】：

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

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

【讨论】：