我对 background-image 属性有疑问。
我想在 div scena 的背景中插入胶卷图像，但是 background-image:url(img/rullino.png); 不显示任何内容。
当我在 Mozilla 上用 Firebug 内联编写它时，它就可以工作了。
有人明白为什么会这样吗？
/* tag */
body,html{
background-color: grey;
font-family: 'Existence Light', arial, sans-serif;
font-size: 1.8em;
height:100%;
}
p {
word-wrap:break-word;
}
/* ======= Generale sezioni ======= */
.sections{
min-height: 100%;
}
/* ======= Entry-section ======= */
#entry-logo img{
margin: 10% 0 0;
}
#entry-section #go-down{
margin-top: 9%;
text-align: center;
}
#entry-section i{
content:"\f078";
color:white;
}
/* ======= film-section ======= */
#film{
height:100%;
}
#film > .container{
height:100%;
padding:0;
margin:0;
width:100%;
}
.container > #rullino {
height:20%;
background-color:red;
}
body #film .container #rullino .scena {
background-image: url(img/rullino.png);
background-color: #00ff00;
background-repeat: no-repeat;
height:100%;
width:15%;
float:left;
}
#rullino img{
max-height:70%;
}<body>
<section id="entry-section" class="sections">
<div class="container">
<div id="entry-logo">
<img src="img/logo.png" width="100%" alt="Un Autre Chien Andalou">
</div>
</div>
<div id="go-down">
<i class="fa fa-chevron-down"></i>
</div>
</section>
<section id="film" class="sections">
<div class="container">
<div id="rullino">
<div id="scena1" class="scena">
<p>scena1</p>
</div>
<div id="scena2" class="scena">
<p>scena2</p>
</div>
<div id="scena3" class="scena">
<p>scena3</p>
</div>
<div id="scena4" class="scena">
<p>scena4</p>
</div>
<div id="scena5" class="scena">
<p>scena5</p>
</div>
</div>
</div>最佳答案
我用这张小狗的图片试过你的代码，它对我有用:“http://g-ecx.images-amazon.com/images/G/01/img15/pet-products/small-tiles/23695_pets_vertical_store_dogs_small_tile_8.CB312176604.jpg”。
所以看起来它可能是您的图像路径。而不是“img/rullino.png”，尝试“./img/rullino.png”或图像的绝对路径，以便它检查图像的当前文件夹。
此外，这只是提高可读性的提示 + 更简洁的 CSS - 如果您希望将图像作为所有带有“.scena”类的 div 的背景，您只需要这样做:
.scena {
background-image: url(img/rullino.png);
background-color: #00ff00;
background-repeat: no-repeat;
height:100%;
width:15%;
float:left;
}
希望这对您有所帮助!
关于css - 背景图像不加载，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/36534868/