Tailwind CSS 練習問題 48：アニメーション（回転）
Tailwind CSSにおいて、ローディングアイコンなどの要素を無限に回転させるアニメーションを適用したい場合、正しいものはどれか。
- クラスとして「animate-spin」を使用する
- クラスとして「rotate-spin」を使用する
- クラスとして「spin-infinite」を使用する
- クラスとして「motion-spin」を使用する
- クラスとして「loop-rotate」を使用する
正解と解説を見る
正解：クラスとして「animate-spin」を使用する
要素を無限に回転させる場合、「animate-spin」が正解です。
【正解の理由】
Tailwind CSSには、標準でいくつかのアニメーションクラスが用意されており、「animate-spin」を指定すると、CSSの`@keyframes`を利用した無限回転のローディングアニメーションが適用されます。
【不正解の理由】
• 「クラスとして『rotate-spin』を使用する」は、存在しないクラス名であるため誤り（角度指定はrotate-45など）
• 「クラスとして『spin-infinite』を使用する」は、存在しないクラス名であるため誤り
• 「クラスとして『motion-spin』を使用する」は、存在しないクラス名であるため誤り
• 「クラスとして『loop-rotate』を使用する」は、存在しないクラス名であるため誤り