text-transformプロパティ

TOPページに戻る > CSS

text-transformプロパティ

英字を大文字、小文字に変更できるプロパティ
単語の先頭の文字を大文字で表示することもできます

使い方（書式）

セレクタ { text-transform: 値; }                                    

text-transformプロパティ

対応ブラウザ
適用できる要素	全てのhtml要素
子要素へのスタイルの継承	する

プロパティの値	説明
capitalize	単語の先頭の文字を大文字で表示
lowercase	全ての英字を小文字で表示
uppercase	全ての英字を大文字で表示
none	通常表示

実際の指定方法

.hoge { text-transform: capitalize; }  /* 単語の先頭の文字を大文字で表示 */

.hoge2 {  text-transform: lowercase; }   /* 全ての英字を小文字で表示 */

.hoge3 {  text-transform: uppercase; }   /* 全ての英字を大文字で表示 */

.hoge4 { text-transform: none; }   /* 通常表示 */

html部分

<p class="hoge">capitalize</p>
<p class="hoge2">lowercase</p>
<p class="hoge3">uppercase</p>
<p class="hoge4">none</p>

実際の表示

capitalize

lowercase

uppercase

none

日本語は？

日本語には今のところ効果ありません
※CSS3で日本語を全角に変更できる値が出てくるかもしれません