テキスト(TEXT)の属性と指定できる値の一覧は以下の通りです。
属性 | 値 | 対応ブラウザ | 備考 |
color | 色名、RGB指定、RRGGBB指定 (注1) | IE,NN | テキストの色 |
text-align | left,center,right,justify | IE,NN | 水平位置 |
text-justify | distribute-all-lines | IE | 均等割付 |
text-decoration | none,underline,overline, linethrough,blink | NN,IE(blinkを除く) | 装飾 |
text-indent | 数値+ 単位(mm,cm,in,pt,pc,em,ex,px,%) | IE,NN | 字下げ |
vertical-align | baseline,sub,super(インライン要素) top,bottom,middle(セル要素) | IE4.0以降、 NN4.0以降 (sub,super除く) | 垂直位置 |
text-transform | capitalize,uppercase, lowercase,none | IE4.0以降 | 大文字、小文字の制御 |
letter-spacing | mm,cm,in,pt,pc,em,ex,px | IE4.0以降 | 文字間隔 |
white-space | normal,pre | NN4.0以降 | 空白 |
ruby-align | left,center,right,distribute-letter distribute-space,line-edge | IE5.0以降 | ルビの配置 |
ruby-position | above,inline | IE5.0以降 | ルビの位置 |
個人的に上の表の中でよく使うのはcolor,text-indent,text-decoration,text-alignぐらいでしょうか。IE,NNの両方に対応していないものはあまり使わない方が無難です。もっともNNの対応状況は極めて悪いので、スタイルシートを使う際にはどこかで踏ん切りが必要です。
(注1)RGB、RRGGBB指定は16進数での指定になります。
RRGGBBで赤を指定する場合 color:#ff0000
青を指定する場合 color:#0000ff
RGBで赤を指定する場合 color:#f00
青を指定する場合 color:#00f
色名については「8.色名で指定できる色一覧」を参照してください。
フォントの属性と指定できる値は以下の通りです。
属性 | 値 | 対応ブラウザ | 備考 |
font-family | フォント名、一般名 (注2) | IE,NN | 書体の指定 |
font-size | 数値+ 単位(mm,cm,in,pt,pc,em,ex,px,%) キーワード (注3) | IE,NN | 文字の大きさ |
font-weight | 100,200,300,400, 500,600,700,800,900, bold,bolder,lighter | IE,NN | 文字の太さ |
line-height | 数値+ 単位(mm,cm,in,pt,pc,em,ex,px,%) | IE,NN | 行間 |
font-style | italic,oblique,normal | IE,NN | 斜体 |
font-variant | small-caps,normal | IE4.0以降 | スモールキャップ |
line-break | strict,normal | IE5.0 | 禁則処理 |
word-break | break-all,keep-all,normal | IE5.0 | 改行処理 |
(注2)
フォントの一般名は次の通りです。
serif,sans-serif,cursive,fantasy,monospace
フォント名での指定で、MS ゴシックのように名前の中に半角スペースが含まれる場合、ダブルクォーテーション(")かシングルクォーテーション(')でくくる必要があります。
例:H4{font-family: "MS P明朝";}
<P STYLE="font-family: 'MS ゴシック'";>〜<P>
(注3)
数値での指定は数値+単位で書きます。
例:BODY{font-size:14px;}
<SPAN STYLE="font-size:1.5em;">〜<SPAN>
キーワードは次の通りです。
xx-small,a-small,small,medium,large,x-large,xx-large
フォントに関する属性を一括指定する場合は次のように書きます。
BODY{font:14px /130% "MS UI Gothic" ;}
上の例では<BODY>タグにフォントの大きさ、行間、フォントの種類を指定しました。各属性をセミコロンで分ける必要はありません(最後には必要です)。気を付けなければならないのは行間で、これは必ずフォントサイズの次に"/"を付けて書きます。