无法从 css 加载图像以引导 carrousell

Question

我在我的网站中使用引导轮播，我想为轮播的图像添加一些效果，为此我需要从 CSS 而不是 HTML 加载图像，但如果我删除 img 标签，那么轮播就不会'不显示任何内容并跳到下一张幻灯片。

这是一个显示轮播如何加载幻灯片的 div 标签。

<div class="item">
<img src="path/img.png" alt="Second slide">
<div class="container"> 
</div>

这是我的 CSS

.imagefromcss{
background-image:url("path/to/bg.png"), url("path/to/another.jpg");
background-repeat: repeat, no-repeat;
background-size:auto, cover;
}

这就是我尝试使用 imagefromcss 类从 css 加载图像但没有图像显示的方式

<div class="item">
<img src="" alt="Second slide" class="imagefromcss">
<div class="container"> 
</div>

有人可以建议我如何实现这一目标吗？

Answer 1

为背景图像指定宽度和高度，如下所示。

.imagefromcss{
 background-image:url("path/to/bg.png"), url("path/to/another.jpg");
 background-repeat: repeat, no-repeat;
 background-size:auto, cover;
 width:300px;
 height:300px; 
 }

Sample DEMO