text-transform

アルファベットの表示方法を指定します。


ブラウザ

IE4 / IE5 / IE5.5 / IE6 / N6 / N7 / O6 / O7 / O9 / Fx1 / Fx2 / IE5 mac

▲PageTop

書式

要素[.class名][#id名]{ text-transform : 値; }

▲PageTop

指定できる値

値 初期値 意味
none ○ 指定していない場合と同様になります。
capitalize 単語の1文字目だけ大文字で表示させます。
uppercase 全て大文字で表示させます。
lowercase 全て小文字で表示させます。

▲PageTop

サンプル

ソースコード

<html>
  <head>
    <title>サンプルコード</title>
    <style type="text/css">
      #sample1 {
        text-transform : capitalize;
      }
      #sample2 {
        text-transform : uppercase;
      }
      #sample3 {
        text-transform : lowercase;
      }
    </style>
  </head>
  <body>
    <div id="sample1">text-transform : captitalizeサンプル</div>
    <div id="sample2">text-transform : uppercaseサンプル</div>
    <div id="sample3">TEXT-TRANSFORM : LOWERCASEサンプル</div>
  </body>
</html>

表示結果

text-transform : captitalizeサンプル
text-transform : uppercaseサンプル
TEXT-TRANSFORM : LOWERCASEサンプル

▲PageTop

▲