Qraft(クラフト) 資格・学習クイズアプリ

Tailwind CSS 練習問題 15:Tailwindのフォントウェイト(font-weight)ユーティリティ

Tailwind CSSにおいて、要素のテキストを太字(font-weight: 700)にしたい場合、正しいクラスはどれか。

  1. font-bold
  2. text-bold
  3. font-weight-700
  4. bold-text
  5. font-700
正解と解説を見る
正解:font-bold

Tailwind CSSでテキストを太字にするには「font-bold」クラスを使用します。これはfont-weight: 700に対応します。

【正解の理由】
Tailwindでは「font-」プレフィックスに続けてthin、light、normal、medium、semibold、bold、extrabold、blackなどのキーワードを指定することでfont-weightを制御します。「font-bold」はfont-weight: 700を適用する標準ユーティリティクラスです。

【不正解の理由】
• 「text-bold」:Tailwindには存在しないクラス名。テキスト関連のユーティリティは「text-」プレフィックスだが、太さの指定には使われない
• 「font-weight-700」:CSSのプロパティ名と値をそのまま繋げた形式だが、Tailwindの命名規則には存在しない
• 「bold-text」:Tailwindの命名規則(プロパティ名が先、値が後)に合っておらず存在しないクラス
• 「font-700」:数値を直接指定する形式はTailwindの標準クラスには存在しない(カスタム設定を除く)

← 前の問題問題一覧次の問題 →
アプリで解いてレーティングを上げる(無料・登録不要)