Edit

Page

Page title:

Page body:

[2] [DFN[[CODE(CSS)@en[[[:target]]]]]] [[擬似クラス]]は[[素片識別子]]によって指定されている[RUBYB[[[対象要素]]]@en[target element]]に適用されます
[SRC[>>1]]。

* 仕様書

[REFS[
- [1] [CITE@en[Selectors Level 3]] ([TIME[2011-09-29 22:16:17 +09:00]] 版) <http://www.w3.org/TR/selectors/#target-pseudo>
- [9] [CITE@en-GB-x-hixie[HTML Standard]] ([TIME[2016-06-09 22:10:00 +09:00]]) <https://html.spec.whatwg.org/#target-element>
- [16] [CITE@en-GB-x-hixie[HTML Standard]] ([TIME[2016-06-09 22:10:00 +09:00]]) <https://html.spec.whatwg.org/#selector-target>
]REFS]

* 意味

[3] [[文書URL]]が[[素片識別子]]により特定の[[要素]]を指している時 (その [[URL]]
でページを開いた時や、ページ内の[[リンク]]の移動でそうなったとき)、当該[[要素]]には
[CODE(CSS)@en[[[:target]]]] [[擬似クラス]]が適用されます。
この[[要素]]を[DFN[[RUBYB[[[対象要素群]]]@en[target elements]]]]といいます [SRC[>>1]]。

[17] [[文書]]は、[DFN[[F[[RUBYB[[[対象要素]]]@en[target element]]]]]]を持ちます [SRC[>>9]]。
初期値は [[null]] です [SRC[>>9]]。
[[文書]]の[[対象要素群]]は、当該[[文書]]の[F[対象要素]]が [[null]]
でなければ[F[対象要素]]を含む[[リスト]]、
[[null]] なら空の[[リスト]]です。 [SRC[>>16]]

;; [4] [[素片識別子]]がどの[[要素]]も指していない時、 [CODE(CSS)@en[[[:target]]]] はどの[[要素]]にも[[一致]]しません。

;; [6] [[素片識別子]]がない場合、 [CODE(CSS)@en[[[:target]]]] はどの[[要素]]にも[[一致]]しません。
[SRC[>>1]]

[10] [[文書]]の[F[対象要素]]は、[[素片識別子へのスクロール]]時に、
その時点の[[文書の[F[示された部分]]]]の[[要素]]に変更されます。

[13] これは [[navigate]] の最後の方の手順で決定されます。
[[文書]]の[[レンダリング]]が開始されて[[構文解析]]が完了していない途中では、
まだ設定されていないことがあります。

[EG[
[14] [CODE(HTMLe)@en[[[script]]]] [[要素]]によって実行される[[スクリプト]]から
[CODE(JS)@en[[[document]].[[querySelector]] ('[[:target]]')]]
しても、[[素片識別子]]で指定された[[要素]]を取得できないことがあります。
]EG]

[5] [[文書の[F[示された部分]]]]は任意の [[DOM]] 操作で変化する可能性がありますが、
[CODE(CSS)@en[:target]] が変化するのは [[navigate]] のタイミングのみとなります。

* 歴史

** 選択子

[REFS[
- [7] [CITE[CSS3 module: W3C selectors]] ([TIME[2000-03-13 23:37:32 +09:00]] 版) <http://www.w3.org/TR/1999/WD-CSS3-selectors-19990803#target-pseudo>
]REFS]

[8] [[選択子3]]の最初の公開案の >>7 には既に [CODE(CSS)@en[[[:target]]]] が含まれていました。

** HTML

[11] [[選択子]]の仕様は[[対象要素]]を[[素片識別子]]によって識別される[[要素]]であるとしか説明していませんでしたが、
[[HTML]] 仕様書はより明確にその決定方法を規定しています。 [[HTML]] の仕様書とはいえ、 [[Webブラウザー]]の挙動について
[CODE(MIME)@en[[[text/html]]]] に限らず適用される規定であり、事実上[[選択子]]仕様の曖昧な部分を明確化する形となっています。

[12] [[Chrome]] では [CODE(DOMm)@en[[[pushState]]]] で[[素片識別子]]が変わっても、
[CODE(CSS)@en[[[:target]]]] の状態は変化しないようです。 [TIME[2014-09-03T12:44:03.000Z]]

[15] [CITE@en[Make :target definition sticky based on last scroll-to-fragment]]
( ([[domenic]]著, [TIME[2016-06-07 22:08:31 +09:00]]))
<https://github.com/whatwg/html/commit/1488bb6f765e41558bb221dc247012a35d88527b>

Historical Legal Sensitive Parent: [Help / License]

Edit

Page

Page name(s)