CSS - text-transform

トップ > CSSリファレンス > text-transform

概要

属性名 text-transform
none | [ [ capitalize | uppercase | lowercase ] || full-width || full-size-kana ]
初期値none
適用可能要素すべての要素
継承継承する
メディアVisual / Text
サポートC1 / e6 / N6 / Fx1 / Ch1 / Op3.5 / Sa1

説明

テキストに影をつけます。

説明
none変換しません。
capitalize各単語の先頭文字を大文字にします。(C1/e6/N6/Fx1/Ch1/Op3.5/Sa1)
uppercaseすべての文字を大文字にします。(C1/e6/N6/Fx1/Ch1/Op3.5/Sa1)
lowercaseすべての文字を小文字にします。(C1/e6/N6/Fx1/Ch1/Op3.5/Sa1)
full-widthすべての文字を全角文字にします。(C3)
full-size-kana半角カナを全角カナに変換します。(C3)

使用例

HTML
<h5>none</h5>
<div style="text-transform:none">
I have a dream that one day this nation will rise up and ...
</div>

<h5>capitalize</h5>
<div style="text-transform:capitalize">
I have a dream that one day this nation will rise up and ...
</div>

<h5>uppercase</h5>
<div style="text-transform:uppercase">
I have a dream that one day this nation will rise up and ...
</div>

<h5>lowercase</h5>
<div style="text-transform:lowercase">
I have a dream that one day this nation will rise up and ...
</div>

<h5>full-width</h5>
<div style="text-transform:full-width">
I have a dream that one day this nation will rise up and ...
</div>

<h5>full-size-kana</h5>
<div style="text-transform:full-size-kana">
アイハブアドリーム ザットワンディ ディスネイション ウィル レイズアップ...
</div>
表示
none
I have a dream that one day this nation will rise up and ...
capitalize
I have a dream that one day this nation will rise up and ...
uppercase
I have a dream that one day this nation will rise up and ...
lowercase
I have a dream that one day this nation will rise up and ...
full-width
I have a dream that one day this nation will rise up and ...
full-size-kana
アイハブアドリーム ザットワンディ ディスネイション ウィル レイズアップ...

Copyright (C) 1997-2012 杜甫々
初版:1997年7月27日、最終更新:2012年5月4日
http://www.tohoho-web.com/css/prop/text-transform.htm