スクロールスナップを使用してスムーズなスクロール体験を提供します。scroll-snap-typeとscroll-snap-alignを組み合わせて使用します。
scroll-snap-type: none | [ x | y | block | inline | both ] [ mandatory | proximity ]一般形: 親に snap-x snap-mandatory、子に snap-start / snap-center
構成要素は scroll-snap-type / scroll-snap-align の項を参照。
scroll-snap-type: x mandatory; scroll-snap-align: start;水平方向に必須スナップ、各要素を開始位置に配置
カルーセルやフォトギャラリーに最適
scroll-snapはコンテナ側（scroll-snap-type）と子側（scroll-snap-align）の2点セットで初めて動きます。AIの生成コードは片側だけの指定になりがちです。JSカルーセルライブラリの多くはscroll-snap+少量のJSで置き換えられる、というモダン化の視点も有効です。
このカルーセルライブラリをscroll-snapベースの軽量実装に置き換えられるか評価して
そのままAIチャットに貼り付けて使える依頼文の例です。ページ上部の「AI用にコピー」でこのページ全体をコンテキストとして渡せます。