Tailwind CSS 練習問題 14:Tailwindのボックスシャドウ(box-shadow)ユーティリティ
Tailwind CSSにおいて、要素に影(ボックスシャドウ)を大きめに付けたい場合、正しいクラスはどれか。
- shadow-lg
- border-lg
- drop-lg
- outline-lg
- ring-lg
正解と解説を見る
正解:shadow-lg
「shadow-lg」はTailwind CSSにおいてbox-shadowプロパティを用いて要素に大きめの影を付けるユーティリティクラスであり、正解となる。「border-lg」はそのような命名のクラスはTailwindに存在せず誤り(ボーダーの太さはborder-2やborder-4のように数値で指定する)。「drop-lg」はTailwindに存在しないクラス名であり誤り(ドロップシャドウにはdrop-shadowという別のクラス体系が存在するが、drop-lgという形式は使わない)。「outline-lg」はそのような命名のクラスはTailwindに存在せず誤り(アウトラインの太さはoutline-2などで指定する)。「ring-lg」はそのような命名のクラスはTailwindに存在せず誤り(リングの太さはring-2やring-4のように数値で指定する)。