大文字にするか小文字するかを指定できるtext-transformプロパティ
text-transform

 テキストを大文字(uppercase)、小文字(lowercase)に変換できます。各単語の先頭文字のみを大文字に変換することもできます(capitalize)。

 これを指定することにより、わざわざHTML側の文字を書き換える必要がなくなるので、運用するうえで管理がしやすくなるといったメリットがあります。

 ただし、日本語には大文字、小文字はないので、このプロパティを指定しても効果はありません。

基本データ

構文 セレクタ{text-transform:値;}
継承
キーワードを使って指定する場合
none、capitalize、uppercase、lowercase
親から継承させる場合
inherit
効果 大文字にするか小文字するかを指定できる
初期値 none
適用箇所 すべての要素

hogehogeですね。

p { text-transform: capitalize;}

動作Webブラウザ

Internet Explorer 5.5、6.0、7.0、8.0以上
Firefox 全バージョン
Safari全バージョン
Opera全バージョン
Chrome全バージョン
iPhone/iPad全バージョン

標準JavaScriptによるDOMでの参照方法

[window.]document.getElementById("【ID属性値】").style.textTransform

jQueryを使った参照方法

$('【セレクタ】').css('text-transform','【値】');
$('【セレクタ】').css({'text-transform':'【値】'});

有限会社タグパンダ
喜安 亮介




HTML5 + UX フォーラム 新着記事
@ITメールマガジン 新着情報やスタッフのコラムがメールで届きます(無料)

注目のテーマ

デザインハック 記事ランキング

本日 月間