CSSアコーディオンアニメーション|AIプロンプト作例

このプロンプトは、JavaScriptを一切使わずにHTML標準のdetails/summary要素とCSSのtransformプロパティだけでアコーディオンUIを実装する方法をAIに生成させるものです。軽量でアクセシビリティにも配慮したコンポーネントが得られます。

フロントエンド学習中の方やライブラリに依存したくい場面での実装案として活用できます。「展開速度を変えたい」「複数パネルを同時に開けないようにしたい」といった条件を追加することで、より実務に近い出力も得られます。