Caution

お使いのブラウザはJavaScriptが実行できない状態になっております。
当サイトはWebプログラミングの情報サイトの為、
JavaScriptが実行できない環境では正しいコンテンツが提供出来ません。
JavaScriptが実行可能な状態でご閲覧頂くようお願い申し上げます。

CSSプロパティ辞典

  1. トップページ
  2. CSSプロパティ辞典
  3. 【CSSセレクタ】E:target

【CSSセレクタ】E:target

セレクタ:target』で、URLのハッシュ値と同じid要素を持つ要素に適用できます。『ハッシュ値』(フラグメント、アンカー)とはURLに記述されている『#』以降の記述となります。例えば『http://wp-p.info/index.html#hoge』ならば『hoge』がハッシュ値です。こちらは一般に『擬似クラス』(:target擬似クラス)と呼ばれます。IE8以下では動きません。

サンプルコード
p:target { color: red;} /* 『ハッシュ値』と同じid属性を持つp要素を赤字にします。 */
ブラウザでの表示結果
p:target { color: red;} /* 『ハッシュ値』と同じid属性を持つp要素を赤字にします。 */

<a href="#hoge_sample">こちらをクリックするとテキストの色が変わります。</a>
<p id="hoge_sample">色が変更されます。</p>

こちらをクリックするとテキストの色が変わります。

色が変更されます。

対応ブラウザ
IE6 IE7 IE8 IE9 IE10 IE11 Safari Chrome Firefox Opera

iPhone Safari Android2系 標準ブラウザ Android4系 標準ブラウザ

記事の間違いや著作権の侵害等ございましたらお手数ですがまでご連絡頂ければ幸いです。