a name の色を変えないCSSの書き方

0

ページ内リンクで「a name」を使うこともあるかと思います。例えば、

[crayon]
目次
[/crayon]

と、こうしておいて、

[crayon]
目次に戻る
[/crayon]

こういうリンクをページ内に設置しておけば、「目次に戻る」をクリックすると、同一ページ内の「目次」の位置まで移動するというアレです。

a name の方のテキストリンクの色を変えたくない

多くのWebサイトにおいては、リンク(a)は使い勝手を考えて通常の文字色とは異なる色をCSSにて定義していることと思います。

先ほどの例で言えば、「目次」も「目次に戻る」も両方とも文字色が変わってしまいます。「目次に戻る」はリンクなので、色が変わっても良いのですが、目次の方は色を変えたくない場合はCSS上で次のように記述すると、a name のみピンポイントで指定できます。

[crayon]
a[name] {
color: #333; //ここは他の文字色と同じものにするとか
}
[/crayon]

ちなみに「hover」の時だけ、という場合は以下のように書けばOKです。

[crayon]
a[name]:hover {
color: #333; //ここは他の文字色と同じものにするとか
}
[/crayon]

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

CAPTCHA