:first-letter擬似要素。
CSSでのセレクタ(選択子)の一つである、:first-letter疑似要素に関して解説します。
:first-letter疑似要素とは。
:first-letter疑似要素とは、当該要素の第一文字目に限り対象とする疑似要素です。
これは、段落の第一文字だけを特に大きく表示させる表示フォーマットを実現させるためのものです。
- 第一文字目だけを対象とするので、当該文字だけに何らかのマークアップを行う事は可能ですが、そのような"物理マークアップ"は好ましいと言えない事がこの擬似要素を導入した理由と思われます。
尚、括弧類が一文字目となる場合は、後続の文字も対象とする事が望ましいとされております。
従って、例えば
<p>『CSS』においては…</p>
となっている場合、『Cが対象となる事が望ましいとされております。
:first-letter疑似要素の書式。
:first-letter疑似要素の書式は、
セレクタ:first-letter
です。
ここで、セレクタ
としては任意のものが使えますが、対象要素を問わない場合なら全称セレクタ(汎用セレクタ)を省略出来ます。
:first-letter擬似要素の注意事項。
:first-letter擬似要素の仕様上の注意。
:first-letter擬似要素は仕様上は実装しなくても構いません。
CSSの仕様では、:first-letter擬似要素は実装を義務付けられておりません。
従って、:first-letter擬似要素でのスタイル指定の効果が見られない場合であっても、それを以って不適合ユーザエージェントと判定する事は出来ません。
- 一般にCSSの仕様で実装が義務付けられていないものに関しては、当該記述をエラーとせず認識して、その記述を無視する事が求められております。
また、実装する場合であっても、全プロパティを実装しなくても構わない事とされております。
:first-letter擬似要素ではプロパティに制限があります。
:first-letter擬似要素においては、以下のプロパティのみが有効とされております。
- フォント関連のプロパティ
- 色・背景関連のプロパティ
- text-decorationプロパティ
- vertical-alignプロパティ(値に制限あり)
- text-transformプロパティ
- line-heightプロパティ
- マージン関連のプロパティ(marginプロパティなど)
- パディング関連のプロパティ(paddingプロパティなど)
- ボーダ関連のプロパティ(borderプロパティなど)
- floatプロパティ
- text-shadowプロパティ
- clearプロパティ
:first-letter擬似要素のPC向けユーザエージェントでの実装上の注意。
:first-letter擬似要素は、
- ネットスケープ 4.x
- インターネットエクスプローラのウィンドウズ版5.0x以前とマッキントッシュ版4.x以前
には実装されておりません。
また、一部で挙動がおかしい場合があります。
:first-letter擬似要素のWAP 2.0での実装上の注意。
WAP 2.0では、:first-letter擬似要素は仕様に含まれておりません。