O'Reilly logo

Mastering Bootstrap 4 - Second Edition by Jason Marah, Benjamin Jakobus

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Carousel

To exhibit the photographic wares, we need a gallery. To implement the gallery feature, we will integrate Bootstrap's carousel component. The carousel acts as a slideshow, with a list of nested elements as the slides.

Let's add a carousel, with three slides, to the Gallery section:

<div class="container-fluid myphoto-section bg-myphoto-light">   <div class="container">      <h3>Gallery</h3>      <div id="gallery-carousel" class="carousel slide" data-         ride="carousel" data-interval="3000">         <div class="carousel-inner" role="listbox">            <div style="height: 400px" class="carousel-item                active">               <img                   class="d-block img-fluid"                  src="images/brazil.png">               <div class="carousel-caption"> Brazil               </div>            </div> <div style="height: 400px" class="carousel-item"> ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required