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="C46f23b98a0a1435884af9e875d40e1a0" 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="Cd0f771948003410eb68f134e2add2f70" class="carousel slide"><ol class="carousel-indicators"><li class="active" data-bs-slide-to="0" data-bs-target="#Cd0f771948003410eb68f134e2add2f70"></li><li data-bs-slide-to="1" data-bs-target="#Cd0f771948003410eb68f134e2add2f70"></li><li data-bs-slide-to="2" data-bs-target="#Cd0f771948003410eb68f134e2add2f70"></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="C9c2ee0204d4342a285a7485a31ac4a8f" class="carousel slide"><ol class="carousel-indicators"><li class="active" data-bs-slide-to="0" data-bs-target="#C9c2ee0204d4342a285a7485a31ac4a8f"></li><li data-bs-slide-to="1" data-bs-target="#C9c2ee0204d4342a285a7485a31ac4a8f"></li><li data-bs-slide-to="2" data-bs-target="#C9c2ee0204d4342a285a7485a31ac4a8f"></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="#C9c2ee0204d4342a285a7485a31ac4a8f" 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="#C9c2ee0204d4342a285a7485a31ac4a8f" role="button"><span aria-hidden="true" class="carousel-control-next-icon"></span><span class="visually-hidden">Next</span></a></div>