From the course: Bootstrap 5 Essential Training

Unlock this course with a free trial

Join today to access over 24,000 courses taught by industry experts.

Carousel

Carousel

- [Instructor] One of the most popular components in Bootstrap is the carousel, which allows you to display a lot of content in a very concise area. Let's take a look at how it works. Basic carousel has three parts to it. It has a main container with a class of carousel. Now, that should have a unique id assigned to it. Now, to get the carousel to work, you have to add a data-bs-ride carousel property. That lets the JavaScript that will handle it know that this is something that you want to auto-advance. The images will change every five seconds by default. Now, there should be a section with a class of carousel-inner, and that's going to have some of the classes that you need and the actual images that you're going to be animating. Each one of those images should have a wrapper of carousel-item. And in the carousel you can control whether the images are sliding from side to side or fading from one image to another by adding these two different classes, carousel-fade or…

Contents