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