ブートストラップ 5: スライダー/カルーセル製品

Question

次の画面に示すように、Bootstrap5 を使用してスライダー/カルーセル製品を作成しようとしています:

ここに貼り付けます。これが私の現在のコードです:

リーリー リーリー

しかし、現時点ではこれは悪いようです:

1 つの項目しか表示されていませんが、このように 3 つ半を表示する必要があります。写真の価格と商品タイトルの下にも追加してみましたが、画像には必ず

Answer 1

これを検索している場合は、this Codepen と this Codeply を見つけることができます。

2 つを組み合わせると、実際の例 (Codepen) が得られます。

JS は各 .carousel-item のコンテンツをクローンするため、各 .carousel-item はその (5) 兄弟のコンテンツを保持します。 CSS は Transform を変更して、スライダーがそれに応じて移動するようにします。

＃＃＃それ