id属性はリンクの終点としても機能するので,その点にも留意しなければなりません。ハイパーリンク)疑似クラス(Pseudo-classes)疑似クラス(pseudo-classes)の概念は,文書ツリーの構造外にある情報,他の単純セレクタを用いて示しきれない情報について,それらの選択を可能にします。要素型名,属性,内容などの構造からでは導き出せない特性について分類をおこなえます。:first-child疑似クラスは例外で,文書ツリーの構造から導き出せます。:lang()疑似クラスも,いくつかの事例では文書構造から導き出せます。ユーザの操作で要素が疑似クラスを獲得したり,消失したりするという点で,疑似クラスは動的と言えます。疑似クラスはセレクタ内においてどこの単純セレクタにも自由に連結できますが,疑似要素についてはセレクタ最後尾にある単純セレクタの末尾に現れねばなりません。互いに排他的な疑似クラスもありますが,単一要素について同時に適用できるものもあります。疑似クラスを持つ規則が互いに競合しあう場合には,通常のカスケード順序によって導かれた結果に従います。Agentは通常,未訪問のリンクか,訪問済みのリンクかに拠って——すなわち,ユーザ環境の履歴情報に基いて——ハイパーリンクのアンカーを区別して表現します。CSSではこの両者の状態を区別するために:linkおよび:visited疑似クラスが提供されています::link始点アンカーを生成する要素のうち,そのリンク先にまだ訪問していないものに一致します。:visited始点アンカーを生成する要素のうち,そのリンク先にユーザが訪問済みのものに一致します。この両者では——未訪問かつ訪問済みの状況はあり得ないので——単一要素で同時にマッチしません。4であれば,これら疑似クラスはhref属性を持つa要素に一致します。}どの要素型がアンカーであるかは文書言語で異るので,次の様にしても構いません。【U-Site】いくつかの例外はあるが、クリックできることを最大限に訴えかけるためには、テキストリンクに色をつけてアンダーラインを引くべきだ。pseudo-classes)インタラクティヴな(対話的にユーザの操作を受けつけるメディアである)環境では,ユーザからの働きかけに応じて,しばしばレンダリングを変化させます。CSS2ではその一般的な事例として,次のような三種類の疑似クラスが提供されています::hover:hover疑似クラスは,ユーザの操作で要素を(マウスなどのポインティング-デヴァイスで)指し示しており,かつアクティヴではない時に適用されます。視覚系ブラウザであれば,要素に拠って生成されたボックスにカーソルを重ね合せた時に適用できます。:active:active疑似クラスは,ユーザからの働きかけを受けてアクティヴ状態にある要素に適用されます。マウスのボタンを押してから放すまでの間などです。キーボードからの,具体的にはEnterキーなどからの,働きかけにも反応するかもしれません。:focus:focus疑似クラスは,ユーザの操作によりフォーカスされている要素に適用されます。(特定のキーボード操作によりフォーカスを受けているか——典型的な環境ではTabキーの操作が多い——もしくはフォームフィールドに入力できる状態の時に適用されます。)これら疑似クラスでは,単一の要素について複数の疑似クラスと同時にマッチするかもしれません。ある場合,ホヴァー時の前景色はカスケード処理に沿って後方の規則に上書きされてしまうので,結果として対象物にホヴァー状態であっても,前景色は変化しないままになります。ある場合,マウスでアクティヴにしても前景色は変化しません。言うと,ユーザはホヴァー状態にしてからアクティヴにするのですが,規則の順序とユーザの操作が逆転している所為でホヴァー時が優先されるのです。}後者の規則が持つセレクタは,テキストエリアにフォーカス時(入力可能な状態)で,かつホヴァー時にマッチします。Agentはこれら疑似クラスの変化にともなって,現在表示している文書を再フローさせる必要はない,とされています。ホヴァー時にある始点アンカーのフォントサイズを通常時より大きく設定すると,この指定はユーザ操作でアンカーを指し示した瞬間に文字列の位置がずれることが豫見されます。いう状況におかれたなら,UAは再フローを避けるために対応するスタイル規則を無視するかもしれません。【註】:これらダイナミック疑似クラスは,あらゆる要素について考えることが可能ですが,実際にどの要素がどのダイナミック疑似クラスに属するのか,どんな状態がどのダイナミック疑似クラスに対応するのか,CSSでは明確にされず,UAの実装に委ねられています。:visited疑似クラスと排他的でした。セレクタは,href属性を持たない終点アンカーにも効果を齎します。して絞込めばよい訣ですが,CSS1適合の旧式ブラウザでは機能しません。親から強制的に継承する。文書側の対応として終点アンカーにa要素を用いず,他の要素にid属性を指定する。値のサポートがあまり芳しくないので,出来るかぎり後者をお奨めします。代りに通常時と同じ値で上書きする方法もあります。こちらも宣言が多いと重複が煩はしいので,お奨めしません。ように,話したり書いたり身振りなどによって表現される,人間が意志を伝達するのに用いる言語——の指定方法が決っている場合,CSS2からはその言語情報に基いたマッチングを行えます。4であればlang属性(XML応用であればxml:lang属性)で指定できます。これら以外にも,HTML文書のヘッダに現れるmeta要素から,もしくはHTTP応答ヘッダなどのプロトコル情報から,言語情報が特定されるかもしれません。ある要素にマッチします。これは単に主コードだけでもマッチし,ハイフン区切りの副コードを附けても構いません。用いた方法でもマッチングできます。著者側で言語慣習ごとにスタイルを適用したい場合に有効です。}【註】:HTMLのlang属性(XMLのxml:lang属性)は特異な汎用属性で,言語コード情報は子孫部に亙って伝播されます。したがって,たといその要素のぢかに言語コードが設定されてなくとも,祖先からの言語コードが引継がれて,:lang()疑似クラスの対象となるかもしれません。他方の属性セレクタを用いた方法はというと,言語情報ではなく,純粋に当該属性に基くので,先述のようにはなりません。pseudo-class):first-child疑似クラスは,ある要素内に初出する子供要素である場合にマッチします。次例では,div要素内に初出する子供のそれがもしp要素ならマッチします。<p>div要素に初出する子供である,p要素にマッチする。<p>同じ兄弟でも,2つめ以降のp要素にはマッチしない。</p></div>親要素を特定する必然性がなければ,次のどちらを用いても構いません。*/最初の子供を導き出すとき,CSSでは先頭のテキストノード(匿名ボックス)を子供として数えません。最初の子供要素に先行するテキストが存在しているにしても,それと照合される訣ではありません。最初の子供要素とマッチングを行います。疑似要素(Pseudo-elements)疑似要素(Pseudo-elements)では,文書言語の文書ツリーで特定される範囲を超越した,抽象的な概念を創り出します。アクセスするような仕組は提供されていません。CSSの疑似要素を用いるとこれらの情報にアクセスできるのです。疑似要素は,ソース文書中に存在しない内容を生成して,スタイル設定を施すこともできます。CSS2仕様での各疑似要素は,セレクタ最後尾にある単純セレクタの末尾にだけ連結できます。あるセレクタの主体にふたつ以上の疑似要素を同時に適用させたい場合,別々のセレクタに分離してその末尾に各疑似要素を連結させる必要があります。同時に適用させています。}疑似要素の処理段階において,文書ツリーは変更されません。スタイルで生成された内容が,たとえば文書の再解析の目的で,文書言語のプロセッサにフィードバックされる事はありません。CSSの整形構造と文書ツリーとでは情報量に差違が生じます。pseudo-element):first-line擬似要素は,段落内に整形されたテキスト先頭行(1行目)に特別なスタイルを施します。先頭行の長さは,表示域の幅やフォントサイズなどの様々な要因に依存します。この擬似要素に附属できるのは,ブロックレヴェル要素,inline-block,table-caption,table-cellのみ。この疑似要素に適用されるプロパティは,次に限定されています:フォントのプロパティ,色と背景のプロパティテキスト:'text-decoration','text-shadow','letter-spacing','word-spacing','text-transform'視覚整形:'clear'(2.1では除外),'line-height','vertical-align'CSS2.1適合のUAでは他のプロパティに適用してもよい,とされます。CSS2.0の場合HTML適合UAにおいて,セレクタ内に:first-line疑似要素が出現するすべての規則を無視してもよく,代りに適用されたプロパティの一部をサポートするだけでもよい,としています。いうクラス名を持つ,p要素の先頭行を赤い背景にします。pseudo-element):first-letter疑似要素は,印刷術では一般的な技法であるイニシャルキャップおよびドロップキャップとして用いられます。ある場合はインライン要素(印刷術におけるイニシャルキャップ)に類似し,それ以外の場合はフロート要素(印刷術におけるドロップキャップ)に類似します。この疑似要素に適用できるのは,ブロックレヴェル要素,list-item,table-caption,table-cell要素のみ。これは原則として先頭行の先頭文字に対して適用されるのですが,時には二文字以上にも適用され得ます。つづく文字,もしくは言語の慣習で特別の組合せに意味のある文字列も,:first-letter疑似要素内に含まれるべきです。(補足:もし先頭行の内容が画像もしくはインラインの表要素から始るなら,この疑似要素は効果を齎しません。list-item')に附隨する:first-letter疑似要素は,マーカーの後につづく主要ブロックボックス内の先頭文字へ適用されます。宣言されているなら,UAは適用せずに無視するかもしれません。'vertical-align'CSS2.1適合のUAでは他のプロパティに適用してもよい,とされます。CSS2.0の場合HTML適合UAにおいて,セレクタ内に:first-line疑似要素が出現するすべての規則を無視してもよく,代りに適用されたプロパティの一部をサポートするだけでもよい,としています。次例を適用するとh1要素の先頭文字は,少し大きめになるでしょう。}次では,疑似要素が重なったときの相互作用の働きについて述べます。}このようなスタイルの場合,:first-letter疑似要素は:first-line疑似要素の内部に生成されます。:first-line疑似要素に設定されたプロパティの値は:first-letter疑似要素に継承されますが,もし同じプロパティが設定されているなら,上書きされます。緑になり,先頭文字を除いた1行目の文字列は青になります。段落の残りは赤になります。:after疑似要素は,'content'プロパティと共に使用し,要素内容の前/後に生成内容を挿入します。要素に生成されるオブジェクト(ボックスや画像)を整形する際には,生成内容もその要素の一部として扱われます。:after疑似要素は自身に連結された要素から継承される凡ゆるプロパティの値を継承します。継承されないなら初期値を採ります。'position'プロパティ,'float'プロパティ,リストの各プロパティ,そして表の各プロパティ。