With Captions
First slide label
Nulla vitae elit libero, a pharetra augue mollis interdum.
Second slide label
Nulla vitae elit libero, a pharetra augue mollis interdum.
Third slide label
Nulla vitae elit libero, a pharetra augue mollis interdum.
<Carousel controls={false} indicators={false}>
{carousel2.map((carousel, i) => (
<Carousel.Item key={i}>
<Image
className='d-block w-100'
src={carousel.img}
alt={`${carousel.text} slide`}
layout='responsive'
/>
<Carousel.Caption className=' d-none d-md-block'>
<h5>{carousel.text} slide label</h5>
<p>
Nulla vitae elit libero, a pharetra augue mollis
interdum.
</p>
</Carousel.Caption>
</Carousel.Item>
))}
</Carousel>
Only Slides
<Carousel controls={false} indicators={false}>
{carousel3.map((carousel, i) => (
<Carousel.Item key={i}>
<Image
src={carousel}
className='d-block w-100'
alt={`Slide ${i + 1}`}
layout='responsive'
/>
</Carousel.Item>
))}
</Carousel>
Slides With captions
<Carousel>
{carousel5.map((carousel, i) => (
<Carousel.Item key={i}>
<Image
className='d-block w-100'
src={carousel.img}
alt={`${carousel.text} slide`}
/>
<Carousel.Caption className=' d-none d-md-block'>
<h5>{carousel.text} slide label</h5>
<p>
Nulla vitae elit libero, a pharetra augue mollis
interdum.
</p>
</Carousel.Caption>
</Carousel.Item>
))}
</Carousel>