いろいろな <p> 要素のテキストを変換します:
p.uppercase {
text-transform: uppercase;
}
p.lowercase {
text-transform: lowercase;
}
p.capitalize {
text-transform: capitalize;
}
Try it Yourself ❯
text-transform プロパティは、テキストの大文字・小文字表示を制御します。
| デフォルト値: | なし |
|---|---|
| 継承: | 継承する |
| バージョン: | CSS1 |
| JavaScript 構文: | object.style.textTransform="uppercase" Try it |
表中の数字は、完全にプロパティをサポートした最初のブラウザのバージョンです。
| プロパティ | |||||
|---|---|---|---|---|---|
| text-transform | 1.0 | 4.0 | 1.0 | 1.0 | 7.0 |
text-transform: none|capitalize|uppercase|lowercase|initial|inherit;
| 値 | 説明 | Play it |
|---|---|---|
| なし | 大文字・小文字の変換をせずに、テキストをそのまま表示します。これがデフォルトです | Play it ❯ |
| capitalize | 各単語の 1 文字目を大文字に変換します | Play it ❯ |
| uppercase | 全文字を大文字に変換します | Play it ❯ |
| lowercase | 全文字を小文字に変換します | Play it ❯ |
| initial | プロパティにデフォルト値を設定します。initial を参照 | Play it ❯ |
| inherit | このプロパティは親要素を継承します。inherit を参照 |
CSS チュートリアル: CSS Text
HTML DOM リファレンス:textTransform プロパティ