html - 关于 bg-image 的所有语法在 css 中都是正确的，但没有显示

Question

我无法在 html 中获取背景图片 div url 是正确的所有语法都是正确的。

HTML

<div class="img-container"></div>

CSS

.img-container {
   background-image: url("../img/photosm.jpg");
 }

Answer 1

您可以测试两件事之一，

1. 确保图片路径正确。在 devtools 网络选项卡中，您可以查看图像是否正确加载。

2. 使用图片作为背景不会让容器继承图片的高宽。它需要有自己的可以这么说。所以尝试设置一个高度/宽度。

.img-container {
   background-image: url("../img/photosm.jpg");
   background-repeat: no-repeat;
   background-position: center;
   background-size: cover;
   height: 20rem;
   width: 30rem;
 }