最終更新日
text-transformは、HTMLファイルに関係なく、テキストを大文字・小文字・全角で表示させるプロパティです。capitalize、uppercase、lowercaseのキーワードに加えて、CSS3では「full-width」が新しく追加されました。
full-widthは、すべての文字を全角で表示します。全角の形式に対応していない文字の場合は変更されません。
capitalize、uppercase、lowercaseのいずれかとfull-widthは、半角スペースで区切って指定することもできます。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;