Bootstrap 5 TutorialLesson 24Free preview
BS5 Carousel
This lesson is part of Bootstrap · All levels
Summary
Carousels or sliders display alternating slides, which can be automatically or manually moved. The main element .carousel with .carousel-inner contains .carousel-item, then the controls .carousel-control-prev and .carousel-control-next. Add .carousel-indicators to the slide pointer point.
Key points
- .carousel is the container and .carousel-item represents each slide.
- The data-bs-ride="carousel" attribute starts the automatic cycle.
- The data-bs-intervals set the interval between slides in milliseconds.
- .carousel-indicators displays the navigation point of the slide.
- .carousel-caption adds the title and text to the slide.
Full lesson
Code examples and quizzes
Full lessons, code examples, and quizzes are available to subscribers. 5 questions.