0

私は CSS の経験がほとんどないので、これは非常に単純な問題かもしれません。

私の Web ページには、次のようなリンクを含む目次があります。

<a href="#user-interface">User interface</a>

他の場所には、次のようなブックマークがあります。

<a name="user-interface">User Interface</a>

それに加えて、次のスタイルの CSS ファイルがあります。

a:hover
{
    color:#D090D0;
    background:#803080;
    text-decoration:none;
}

目標は、カーソルをリンクの上に移動したときにリンクの色と背景色を変更することであり、それは完全に機能しています。しかし、問題は、マウスのピンターをブックマークの上に移動すると、ブックマークのスタイルも変化することです。リンクとブックマークの両方がタグを使用しているので、私には理にかなっています<a>が、CSS で両方を区別する方法がわかりません。リンクにクラスを使用できることはわかっていますが、もっと良い方法があるのではないかと思います。

4

5 に答える 5

5

<a name="...">廃止されました。

代わりに、id="..."任意の要素に を配置する必要があります。

質問に答えるには、 を追加し:linkます。

于 2012-09-14T20:14:16.070 に答える
2

:linkW3Schoolsによると、セレクターは機能しているように見えますが、アクセスされていないリンクにのみ適用されます。

編集: W3Schoolsはこれについて誤解を招くようです。:linkセレクターは、少なくとも一部のブラウザーでは<a>、訪問したかどうかに関係なく、何かにリンクするタグを選択しますが、color属性は、訪問したリンクのブラウザーのデフォルトによってオーバーライドされます。明らかに、属性セレクター、以下で詳しく説明するように、デフォルトのブラウザ設定よりも特異性が高いため、ユーザーが以前にそのリンクをクリックしたかどうかに関係なく、リンクを設定した色に強制する場合は、属性セレクタを使用する必要があります。)

IE6にあまり関心がなく、IE 7および8にDoctypeが指定されている場合、これを行う1つの方法は、属性セレクターを使用することです。

a[href]:hover {
    color:#D090D0;
    background:#803080;
    text-decoration:none;
}

それ以外では、クラスを追加するのが最善だと思います。

于 2012-09-14T20:18:36.420 に答える
1

セレクターを使用:linkしてリンクを選択する

a:link:hover
{
    color:#D090D0;
    background:#803080;
    text-decoration:none;
}

http://jsfiddle.net/9r4L9/

于 2012-09-14T20:14:38.590 に答える
0

次を使用しclassます。

HTML では、class属性を使用します。

<a href="#user-interface" class="foo">User interface</a>
<a name="user-interface">User Interface</a>

CSS で:

.foo:hover
{
    color:#D090D0;
    background:#803080;
    text-decoration:none;
}

現在、スタイルは class を持つ要素にのみ適用されfooます。

于 2012-09-14T20:14:37.347 に答える
0

ブックマークにクラスを追加し、ホバー宣言の後にスタイルを追加します。

<a class="bookmark" name="user-interface">User Interface</a>

そしてCSS:

a:hover
{
    color:#D090D0;
    background:#803080;
    text-decoration:none;
}
a.bookmark {
    color: black;
    background: white;
    text-decoration:none;
}
于 2012-09-14T20:14:57.020 に答える