次の画面に示すように、Bootstrap5 を使用してスライダー/カルーセル製品を作成しようとしています:
ここに貼り付けます。これが私の現在のコードです:
リーリー リーリー
しかし、現時点ではこれは悪いようです:
1 つの項目しか表示されていませんが、このように 3 つ半を表示する必要があります。写真の価格と商品タイトルの下にも追加してみましたが、画像には必ず
これを検索している場合は、this Codepen と this Codeply を見つけることができます。
2 つを組み合わせると、実際の例 (Codepen) が得られます。
JS は各 .carousel-item のコンテンツをクローンするため、各 .carousel-item はその (5) 兄弟のコンテンツを保持します。 CSS は Transform を変更して、スライダーがそれに応じて移動するようにします。
.carousel-item
Transform
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
これを検索している場合は、this Codepen と this Codeply を見つけることができます。
2 つを組み合わせると、実際の例 (Codepen) が得られます。
JS は各
＃＃＃それ.carousel-itemのコンテンツをクローンするため、各.carousel-itemはその (5) 兄弟のコンテンツを保持します。 CSS はTransformを変更して、スライダーがそれに応じて移動するようにします。