我的bootstrap旋转木马没有给幻灯片
我复制了一个引导旋转木马代码以了解其工作原理,但该代码并没有给我带来所需的结果。幻灯片没有移动。第一张幻灯片只是停滞不前。请您提出什么?这是HTML和CSS代码。我还提供了它的屏幕截图,以进行更多澄清。
html
<div class="carousel-inner">
<div class="carousel-item active" style="background-color: red;">
<img src="..." class="d-block w-100" alt="First slide">
</div>
<div class="carousel-item" style="background-color: yellow;">
<img src="..." class="d-block w-100" alt="Second slide">
</div>
<div class="carousel-item" style="background-color: purple;">
<img src="..." class="d-block w-100" alt="Third slide">
</div>
</div>
</div>
css
.carousel-item {
height: 500px;
}
I copied a Bootstrap carousel code to understand how it works but the code isn't giving me the desired result. The slides aren't moving.The first slide is just stagnant. Please what do you reccommend I do? Here are the html and css codes. I also included a screenshot of it for more clarification.
html
<div class="carousel-inner">
<div class="carousel-item active" style="background-color: red;">
<img src="..." class="d-block w-100" alt="First slide">
</div>
<div class="carousel-item" style="background-color: yellow;">
<img src="..." class="d-block w-100" alt="Second slide">
</div>
<div class="carousel-item" style="background-color: purple;">
<img src="..." class="d-block w-100" alt="Third slide">
</div>
</div>
</div>
css
.carousel-item {
height: 500px;
}
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
您需要拥有与Bootstrap相关的适当
ID
和data-ride
的适当父。然后,您需要为You need to have the proper parent with the appropriate
id
anddata-ride
that correlates with Bootstrap. Then you need to add the relative JS and CSS for Bootstrap 4.在您的.html文件的“头”标签中添加此代码。
为什么需要添加此?答案是,每当您使用第三方库时,您需要将其安装在项目中,或者使用其CDN来使其正常工作。
Add this code inside "head" tag of your .html file.
Why do you need to add this? The answer is whenever you are using a 3rd party library either you need to install it in your project or use its CDN to make it work.