div中未显示背景图片

Question

 .jumbotron { margin-bottom: 0px; height: 350px; color: white; text-shadow: black 0.3em 0.3em 0.3em; } 

 <div class="jumbotron" style="background: url('~/images/hdpic.jpg') no-repeat; background-size:cover"> </div> 

我的图片网址是正确的，但我现在不知道为什么它不起作用。 如果有人知道，请帮助我。 谢谢。

Answer 1

检查您的背景图片路径，我已经用另一个图片路径替换了它，并且可以正常工作。

也许用类似../的相对路径代替' ~ '

<div class="jumbotron" style="background: url('https://picsum.photos/200/300') no-repeat; background-size:cover">
</div>

看到这个小提琴

Answer 2

尝试以下代码，将background更改为background-image ，

<div class="jumbotron" style="background-image: url('~/images/hdpic.jpg') no-repeat; 
background-size:cover">
</div>

Answer 3

请参考这一章 。 尝试使用background-image 。 见下文：

 .jumbotron { margin-bottom: 0px; height: 350px; color: white; text-shadow: black 0.3em 0.3em 0.3em; } 

 <div class="jumbotron" style="background-image: url('~/images/hdpic.jpg') no-repeat; background-size:cover"> </div> 

Answer 4

尝试这个

<div class="jumbotron" style="background-image: url('~/images/hdpic.jpg') no-repeat; background-size:cover">
</div>

使用background-image而不是background 。

Answer 5

后台CSS逻辑似乎很好。 然后，您应该使用浏览器的检查器检查显示的div大小是否正确（是否有宽度...？）