Example
<abp-carousel style="width: 500px; height:250px" indicators="false" controls="false">
<abp-carousel-item src="https://via.placeholder.com/500x250.png?text=First+Slide"></abp-carousel-item>
<abp-carousel-item src="https://via.placeholder.com/500x250.png?text=Second+Slide"></abp-carousel-item>
<abp-carousel-item src="https://via.placeholder.com/500x250.png?text=Third+Slide"></abp-carousel-item>
</abp-carousel>
<div style="width: 500px; height:250px" data-bs-ride="carousel" id="C7da74de67458448586dc60e033c7196f" class="carousel slide"><div class="carousel-inner"><div class="carousel-item active"><img alt="" class="d-block w-100" src="https://via.placeholder.com/500x250.png?text=First+Slide"></img></div><div class="carousel-item "><img alt="" class="d-block w-100" src="https://via.placeholder.com/500x250.png?text=Second+Slide"></img></div><div class="carousel-item "><img alt="" class="d-block w-100" src="https://via.placeholder.com/500x250.png?text=Third+Slide"></img></div></div></div>
With indicators
<abp-carousel style="width: 500px; height:250px" indicators="true" controls="false">
<abp-carousel-item src="https://via.placeholder.com/500x250.png?text=First+Slide"></abp-carousel-item>
<abp-carousel-item src="https://via.placeholder.com/500x250.png?text=Second+Slide"></abp-carousel-item>
<abp-carousel-item src="https://via.placeholder.com/500x250.png?text=Third+Slide"></abp-carousel-item>
</abp-carousel>
<div style="width: 500px; height:250px" data-bs-ride="carousel" id="C8fb7cb989ab64e9b99878f3338926347" class="carousel slide"><ol class="carousel-indicators"><li class="active" data-bs-slide-to="0" data-bs-target="#C8fb7cb989ab64e9b99878f3338926347"></li><li data-bs-slide-to="1" data-bs-target="#C8fb7cb989ab64e9b99878f3338926347"></li><li data-bs-slide-to="2" data-bs-target="#C8fb7cb989ab64e9b99878f3338926347"></li></ol><div class="carousel-inner"><div class="carousel-item active"><img alt="" class="d-block w-100" src="https://via.placeholder.com/500x250.png?text=First+Slide"></img></div><div class="carousel-item "><img alt="" class="d-block w-100" src="https://via.placeholder.com/500x250.png?text=Second+Slide"></img></div><div class="carousel-item "><img alt="" class="d-block w-100" src="https://via.placeholder.com/500x250.png?text=Third+Slide"></img></div></div></div>
With controls
<abp-carousel style="width: 500px; height:250px" indicators="true" controls="true">
<abp-carousel-item src="https://via.placeholder.com/500x250.png?text=First+Slide"></abp-carousel-item>
<abp-carousel-item src="https://via.placeholder.com/500x250.png?text=Second+Slide"></abp-carousel-item>
<abp-carousel-item src="https://via.placeholder.com/500x250.png?text=Third+Slide"></abp-carousel-item>
</abp-carousel>
<div style="width: 500px; height:250px" data-bs-ride="carousel" id="Ca8ec0e850a5e41269f05c8de76fcd51d" class="carousel slide"><ol class="carousel-indicators"><li class="active" data-bs-slide-to="0" data-bs-target="#Ca8ec0e850a5e41269f05c8de76fcd51d"></li><li data-bs-slide-to="1" data-bs-target="#Ca8ec0e850a5e41269f05c8de76fcd51d"></li><li data-bs-slide-to="2" data-bs-target="#Ca8ec0e850a5e41269f05c8de76fcd51d"></li></ol><div class="carousel-inner"><div class="carousel-item active"><img alt="" class="d-block w-100" src="https://via.placeholder.com/500x250.png?text=First+Slide"></img></div><div class="carousel-item "><img alt="" class="d-block w-100" src="https://via.placeholder.com/500x250.png?text=Second+Slide"></img></div><div class="carousel-item "><img alt="" class="d-block w-100" src="https://via.placeholder.com/500x250.png?text=Third+Slide"></img></div></div><a class="carousel-control-prev" data-bs-slide="prev" href="#Ca8ec0e850a5e41269f05c8de76fcd51d" role="button"><span aria-hidden="true" class="carousel-control-prev-icon"></span><span class="visually-hidden">Previous</span></a><a class="carousel-control-next" data-bs-slide="next" href="#Ca8ec0e850a5e41269f05c8de76fcd51d" role="button"><span aria-hidden="true" class="carousel-control-next-icon"></span><span class="visually-hidden">Next</span></a></div>