<!doctype html>
<
html
lang
=
"en"
>
<
head
>
<
link
href
=
rel
=
"stylesheet"
integrity
=
"sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC"
crossorigin
=
"anonymous"
>
<
script
src
=
integrity
=
"sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM"
crossorigin
=
"anonymous"
>
</
script
>
</
head
>
<
body
>
<
h1
class
=
"m-4 text-success"
>
GeeksforGeeks</
h1
>
<
h4
class
=
"ms-4"
>
Bootstrap 5 Carousel Individual
.carousel-item bg-dark interval
</
h4
>
<
div
class="container mb-4 p-4
text-light text-center">
<
div
id
=
"carouselExample"
class
=
"carousel slide carousel-fade"
data-bs-ride
=
"carousel"
>
<
div
class
=
"carousel-inner"
>
<
div
class
=
"carousel-item bg-dark active"
data-bs-interval
=
"2000"
>
<
h1
class
=
"m-4 text-success"
>
This is the first slide</
h1
>
<
img
src
=
alt
=
"GFG LOGO"
>
<
h4
class
=
"m-4"
>
This slide has a time delay of 2000ms</
h4
>
</
div
>
<
div
class
=
"carousel-item bg-dark"
data-bs-interval
=
"4000"
>
<
h1
class
=
"m-4 text-warning text-center"
>
This is the second slide</
h1
>
<
div
class
=
"text-center"
>
<
img
src
=
alt
=
"GFG LOGO"
>
</
div
>
<
h4
class
=
"mt-3"
>
This slide has a time delay of 4000ms</
h4
>
</
div
>
<
div
class
=
"carousel-item bg-dark"
data-bs-interval
=
"6000"
>
<
h1
class
=
"m-4 text-warning"
>
This is the third slide</
h1
>
<
div
class
=
"text-center"
>
<
img
src
=
alt
=
"GFG LOGO"
>
</
div
>
<
h4
class
=
"mt-3"
>
This slide has a time delay of 6000ms</
h4
>
</
div
>
</
div
>
<
button
class
=
"carousel-control-prev"
type
=
"button"
data-bs-target
=
"#carouselExample"
data-bs-slide
=
"prev"
>
<
span
class
=
"carousel-control-prev-icon"
aria-hidden
=
"true"
></
span
>
<
span
class
=
"visually-hidden"
>Previous</
span
>
</
button
>
<
button
class
=
"carousel-control-next"
type
=
"button"
data-bs-target
=
"#carouselExample"
data-bs-slide
=
"next"
>
<
span
class
=
"carousel-control-next-icon"
aria-hidden
=
"true"
></
span
>
<
span
class
=
"visually-hidden"
>Next</
span
>
</
button
>
</
div
>
</
div
>
</
body
>
</
html
>