CSS基礎 練習問題 21:CSSの文字の大文字・小文字変換
要素の文字を大文字だけで表示したい(HTML上は小文字で記述していても画面上ではすべて大文字に変換して表示したい)場合、正しいCSSの書き方はどれか。
- text-transform: uppercase;
- font-variant: uppercase;
- text-align: uppercase;
- font-style: uppercase;
- white-space: uppercase;
正解と解説を見る
正解:text-transform: uppercase;
文字の大文字・小文字表記を制御するプロパティはtext-transformであり、値にuppercaseを指定するとすべての文字が大文字で表示されます。
【正解の理由】
text-transform: uppercase;を指定すると、HTMLソース上の記述に関わらず、画面表示上ではすべての英字が大文字に変換されて表示されます。
【不正解の理由】
• 「font-variant: uppercase;」:スモールキャピタル(小型の大文字)などフォントの字形バリエーションを制御するプロパティで、uppercaseという値は正しい指定方法ではない
• 「text-align: uppercase;」:テキストの水平方向の配置(左寄せ・中央寄せなど)を指定するプロパティであり、文字種の変換とは無関係
• 「font-style: uppercase;」:斜体(イタリック)などフォントのスタイルを指定するプロパティであり、大文字変換の機能はない
• 「white-space: uppercase;」:空白や改行の扱いを制御するプロパティであり、文字の大文字化とは無関係