最終更新日 
text-transformプロパティ
text-transformは、HTMLファイルに関係なく、テキストを大文字・小文字・全角で表示させるプロパティです。capitalize、uppercase、lowercaseのキーワードに加えて、CSS3では「full-width」が新しく追加されました。
full-widthは、すべての文字を全角で表示します。全角の形式に対応していない文字の場合は変更されません。
capitalize、uppercase、lowercaseのいずれかとfull-widthは、半角スペースで区切って指定することもできます。full-widthを指定すると、日本語の半角カナ文字を全角カナ文字へ変更することが可能です。
CSS3での変更点
・値に「full-width」が追加されました。
| 初期値 | 適用先 | 継承 |
|---|---|---|
| none | すべての要素 | あり |
| 値 | 説明 |
|---|---|
| none | 記述した通りに表示されます。（初期値） |
| capitalize | 単語の先頭の文字のみ大文字で表示します。 |
| uppercase | すべての文字を大文字で表示します。 |
| lowercase | すべての文字を小文字で表示します。 |
| full-width | すべての文字を全角で表示します。全角の形式に対応していない文字の場合は変更されません。 |
サンプルコード
text-transform: none; text-transform: capitalize; text-transform: uppercase; text-transform: lowercase; text-transform: full-width; text-transform: capitalize full-width; text-transform: uppercase full-width; text-transform: lowercase full-width;
参考文献：CSS Text Level 3
当サイトの活動をサポートしてみませんか？気軽にクリエイターの支援ができます。