カルーセル

このコンポーネントはAsagaoUIオリジナルのコンポーネントです。デジタル庁デザインシステムにはこのコンポーネントは定義されていません。

複数のコンテンツや画像を横にスライドさせて表示したい用途で便利に使用できます。CSSのみで構成されているため、JavaScriptは必要ありません。

<div class="carousel">
    <ul class="carousel-inner">
        <li class="carousel-item">
            <img src="https://placehold.co/1280x720" alt="">
        </li>
        <li class="carousel-item">
            <img src="https://placehold.co/1280x720" alt="">
        </li>
    </ul>
</div>