次で定義される特性は,文字,スペース,単語及び段落の視覚表示に影響を与える。
値: | <length> | <percentage> | inherit |
初期値: | 0 |
適用対象: | ブロックレベル要素 |
継承: | する |
パーセント値: | 包含ブロックの幅を 参照する |
メディア: | 視覚メディア |
この特性は,ブロック内におけるテキストの最初の行の字下げを指定する。 厳密にいえば,ブロックの最初の 行ボックスに流し込む最初のボックスの字下げ を指定する。行の左辺(又は左向きのレイアウトでは右辺)に対してボックスは 字下げされる。利用者エージェントはこの字下げを空白スペースとしてレンダリングするのがよい。
値には次の意味がある。
'text-indent'の値は負で あってもよいが,実装固有の制限が存在することもある。
次の例では,テキストに'3em'分の字下げが生じる。
P { text-indent: 3em }
値: | left | right | center | justify | <string> | inherit |
初期値: | 利用者エージェント及び表記方向 に依存する |
適用対象: | ブロックレベル要素 |
継承: | する |
パーセント値: | N/A |
メディア: | 視覚メディア |
この特性は,ブロックの行内内容がどのように配置されるかを記述する。 値には次の意味がある。
テキストのブロックは行ボックスの積重ねである。 'left', 'right' 及び 'center'が指定される場合, この特性は,行ボックスの左側及び右側に対 して各行ボックス内の行内ボックスをどのように配置するかを指定する。即ち, 表示域に対して位置が配置されるわけではない。 'justify'が指定される場合は, UAは,その位置を調整するだけでなく,行内ボックスを伸縮させて もよい。 'letter-spacing' 及び 'word-spacing'をも参照。
次の例では, 'text-align'が継承されるため, 'class=center'を有するDIV要素内のすべてのブロックレベル要素は行内内容を中央に寄せること になる点に注意すること。
DIV.center { text-align: center }
備考: 使用される実調整アルゴリズムは,利用者エージェント及び表記言語に依存する。
適合する利用者エージェントは, 各々要素のデフォルト表記方向が右向きであるか又は左向きであるかに依存して,'left'又は 'right'として“justify”値を解釈してもよい。
値: | none | [ underline || overline || line-through || blink ] | inherit |
初期値: | none |
適用対象: | すべての要素 |
継承: | しない (説明を参照) |
パーセント値: | N/A |
メディア: | 視覚メディア |
この特性は要素のテキストに付加される装飾を記述する。特性がブロックレベル要素に指定される場合, 要素の行内レベル子孫のすべてに影響を与える。特性が 行内レベル要素に指定されるか又は影響を及ぼす場 合,要素が生成するすべてのボックスに影響を与える。 要素に内容又はHTMLのIMG要素などのテキスト内容がない場合,利用者エージェントはこの特性を 無視しなければならない。
値には次の意味がある。
テキスト装飾に必要とされる色は'color'特性値から派生させるのがよい。
この特性は継承されないが,ブロックボックスの子孫ボックスは, すべてに下線を引くなど,同じ装飾を用いてフォーマットされるのが望ましい。 子孫要素の'color'値が異なったとしても,装飾の色は 同じにするのがよい。
次のHTMLの例では,ハイパリンクとして動作するすべてのA要素のテキスト内容に下線を 施す。
A[href] { text-decoration: underline }
この特性は,要素のテキストに適用される影効果をカンマで区切ったリストで 指定する。影効果は,指定された順で適用され,各効果は互いに被さってもよいが, テキスト自体に上塗りすることはない。影効果はボックスのサイズを変更しないが, その境界の範囲外に効果が及んでもよい。影効果のスタックレベルは要素自体のスタックレベルと 同じである。
各影効果は影のオフセットを指定しなければならず,ぼかし範囲及び影色は任意で 指定してよい。
影のオフセットは,テキストからの距離を示す二つの <length>値を用いて指定される。 最初の長さの値は,テキストの右へずらす左右距離を指定する。 左右方向の長さの値が負の場合は,影をテキストの左にずらす。二番目の長さの値は, 影をテキストの下側にずらす上下距離を指定する。上下方向の長さの値が負の場合は, テキストの上に影をずらす。
ぼかし範囲を影のオフセットの後に任意に指定してよい。 ぼかし範囲は,ぼかし効果の境界を示す長さの値である。 ぼかし効果を計算する正確なアルゴリズムは指定されない。
色値は,影効果の長さの値の前後に任意に指定されてよい。 色値は影効果の基調として使用される。色が指定されない場合, 'color'特性の値が代わりに使用される。
テキストの影は :first-letter擬似要素及び :first-line擬似要素とともに使用されてよい。
次の例では,テキストの影を要素のテキストの右下に設定している。 色が指定されていないので,影は要素自体と同じ色となる。 さらに,ぼかし範囲が指定されないので,テキストの影はぼかされない。
H1 { text-shadow: 0.2em 0.2em }
次の例は,要素のテキストの右下に影を付けることになる。 影には5pxの範囲でぼかしが生じ,影の色は赤となる。
H2 { text-shadow: 3px 3px 5px red }
次の例は,影効果のリストを指定する。最初の影は要素のテキストの右下に あり,影の色は赤であり,ぼかしはない。二番目の影は,最初の影効果に 上塗りされることになり,色は黄色であり,ぼかしが生じる。位置はテキストの 左下に付けられる。三番目の影効果はテキストの右上に付けられる。 影の色は三番目の影効果には指定されていないので,要素の 'color'特性の値が使用される。 :
H2 { text-shadow: 3px 3px red, yellow -3px 3px 2px, 3px -3px }
次の例を考えてみる。
SPAN.glow { background: white; color: white; text-shadow: black 0px 0px 5px; }
この場合, 'background'特性及び 'color' 特性は同じ値になり, 'text-shadow'特性は "日食"のような効果を生成するために使用される。
備考: この特性はCSS1では定義されない。最後の例のような影効果は,CSS1しか サポートしないUAでは,不可視のテキストをレンダリングする場合もある。
値: | normal | <length> | inherit |
初期値: | normal |
適用対象: | すべての要素 |
継承: | する |
パーセント値: | N/A |
メディア: | 視覚メディア |
この特性は,テキストの文字間におけるスペースの振舞いを指定する。値には次の意味がある。
文字間隔アルゴリズムは利用者エージェントに依存する。文字間隔は,両端揃えに よっても影響される場合がある。 'text-align'特性を参照。
次の例では, BLOCKQUOTE要素の文字間スペースは'0.1em'分増加される。
BLOCKQUOTE { letter-spacing: 0.1em }
次の例では, 利用者エージェントは,文字間スペースを変更することができない。
BLOCKQUOTE { letter-spacing: 0cm } /* Same as '0' */
結果として生じる二文字間のスペースがデフォルトスペースと同じではない場合, 利用者エージェントは リガチャを 使用しないことが望ましい。
適合する利用者エージェントが, 'letter-spacing'特性の値を 'normal'であるとみなすこともある。
値: | normal | <length> | inherit |
初期値: | normal |
適用対象: | すべての要素 |
継承: | する |
パーセント値: | N/A |
メディア: | 視覚メディア |
この特性は単語間隔を指定する。値には次の意味がある。
単語間隔アルゴリズムは利用者エージェントに依存する。 単語間隔も両端揃えによって影響される ( 'text-align'特性参照)。
次の例では, H1要素の各単語間の単語間隔は'1em'分増加される。
H1 { word-spacing: 1em }
適合する利用者エージェントは, 'word-spacing'特性の値を 'normal'であるとみなしてもよい。
値: | capitalize | uppercase | lowercase | none | inherit |
初期値: | none |
適用対象: | すべての要素 |
継承: | する |
パーセント値: | N/A |
メディア: | 視覚メディア |
この特性は,要素のテキストの大文字化効果を制御する。 値には次の意味がある。
各々の場合における実際の変換は表記言語に依存する。 要素の言語を認識する方法については, RFC 2070 ([RFC2070])を 参照。
適合する利用者エージェントは,文字列がLatin1 レパートリを起源としない場合及び言語の大小文字の変換方法がISO 10646 ([ISO10646])の大小文字変換表によって規定される方法と異なる場合, 'text-trasform'を'none'とみなしてもよい。
次の例では, H1要素のすべてのテキストが大文字テキストに変換される。
H1 { text-transform: uppercase }
値: | normal | pre | nowrap | inherit |
初期値: | normal |
適用対象: | ブロックレベル要素 |
継承: | する |
パーセント値: | N/A |
メディア: | 視覚メディア |
この特性は,要素内の空白がどのように操作されるか を宣言する。値には次の意味がある。
次の例は,HTMLのPRE要素,P要素及び "nowrap"から期待される空白の振舞いが何であるかを示す。
PRE { white-space: pre } P { white-space: normal } TD[nowrap] { white-space: nowrap }
適合する利用者エージェントは, 文書作成者及び利用者のスタイルシートの 'white-space'特性を 無視してよいが,デフォルトスタイルシートでは'white-space'特性に値を指定しなけ ればならない。