Bootstrap CSS Classes

Bootstrap CSS class .carousel-control-next-icon

    <div id="carouselExample" class="carousel slide" data-bs-ride="carousel">
        <div class="carousel-inner">
            <div class="carousel-item active">
                <img src="https://via.placeholder.com/800x450" class="d-block w-100 bg-secondary" style="height:250px;" alt="photo 1">
            </div>
            <div class="carousel-item">
                <img src="https://via.placeholder.com/800x450" class="d-block w-100 bg-secondary" style="height:250px;" alt="photo 2">
            </div>
            <div class="carousel-item">
                <img src="https://via.placeholder.com/800x450" class="d-block w-100 bg-secondary" style="height:250px;" alt="photo 3">
            </div>
        </div>
        <a class="carousel-control-prev" href="#carouselExample" role="button" data-bs-slide="prev">
            <span class="carousel-control-prev-icon" aria-hidden="true"></span>
            <span class="visually-hidden">Previous</span>
        </a>
        <a class="carousel-control-next" href="#carouselExample" role="button" data-bs-slide="next">
            <span class="carousel-control-next-icon" aria-hidden="true"></span>
            <span class="visually-hidden">Next</span>
        </a>
    </div>

Preview

Check .carousel-control-next-icon in a real project

Click one of the examples listed below to open the Shuffle Visual Editor with the UI library that uses the selected component.

More Bootstrap CSS classes in Carousel category

© 2024 Shuffle. All rights reserved.