24

次の亜種は同じ結果を生成するようです:

/* 1 */
a, a:visited, a:active { color: black; }
a:hover { color: red; }

/* 2 */
a, a:link, a:visited, a:active { color: black; }
a:hover { color: red; }

/* 3 */
a:link, a:visited, a:active { color: black; }
a:hover { color: red; }

Web 上のほとんどのガイダンスでは 2 または 3 が使用されています。最も単純なバリアントである 1 を使用しないのはなぜですか? :link通常のリンク用のスタイルとホバー用のスタイルが 1 つずつ必要な場合は、適用する正当な理由が見つかりません。

使用しないのがベストプラクティス:linkですか? なぜですか、そうでないのですか？

リンクが訪問されたかどうかは気にしません。どちらも同じスタイルを受け取ります。ホバーするかホバーしないかだけを気にします。この質問は、亜種が何をするかについてではなく、すべて同じことをします。それは、最良の変種が何であるかについてです。バリアントの 1 つに欠陥がありますか? どれがベストプラクティスですか?

4

5 に答える 5

68

すべてaがリンクではないからです。

<a name="table_of_contents">Table of Contents</a>

はリンクではなく、 でリンクできるアンカーです<a href="#table_of_contents">。

a一致する、一致しa:linkない。

于 2013-08-24T17:51:32.230 に答える
21

単純なアンカーと href 属性を持つアンカーを区別するために使用されます。ここでデモ jsfiddle を参照してください。

<style>
a { color: red; }
a:link { color: blue; }
</style>
<a name="anchor">No href</a><br />
<a href="http://stackoverflow.com/">With href</a>

編集: このため、CSS ですべてのケースをカバーすることが重要です。オプション 2 は、すべてのケースを完全にカバーする唯一のオプションです。属性のないアンカー要素がない場合hrefは、オプション 1 で問題ありません。

于 2013-08-24T17:49:51.400 に答える
2

a:link訪問されていないリンク専用です。<a>あなたが言ったように、すべての要素に適用されます

リンクが訪問されたかどうかは気にしません

次に、の使用を避けることができますa:link...の使用のみa...a:hover...a:activeがあなたのニーズを満たします

また、アンカーにa:linkない場合は機能しませんが、機能しますhrefa

于 2013-08-24T17:55:02.467 に答える
1

使えると思います

<a>

別の結果を生成できるようにボタンを作成するには...私は常に使用しますa:link

于 2013-08-24T17:44:10.840 に答える
1

それはあなたの意図だけに依存するので、あなたの例では、すべてのアンカー要素を 1 つの色でスタイルし、要素がホバーされたときにのみスタイルを変更します。

a {color: #000;}
a:hover {color: #f00;}

あなたの場合、リンクがホバーされているときにのみリンクの色を変更しています。基本ルールの後に hover 疑似要素を追加する必要があります。そうしないと、スタイル シートのカスケードによりオーバーライドされます。

この場合にすべての疑似要素を使用し、唯一の違いをホバーにしたい場合は、次のようになります。

a:link, a:visited, a:focus, a:active {color: #000;}
a:hover {color: #f00;}

疑似クラス名は自明です。

  • :link - 未訪問のリンク
  • :visited - 訪問したリンク
  • :active - リンクがアクティブなとき (たとえば、クリックまたはキーボード イベントでアクティブ化されたとき)
  • :focus - リンクがフォーカスを得たとき、例えば、ユーザーが要素をタブで移動し、それが選択された要素である場合
  • :hover - ホバーまたはマウスオーバーされたとき

疑似クラスを使用する利点は、単にアンカー要素をターゲットにするよりも特異性が高いことです。ただし、あなたの場合は必要ないかもしれません。

于 2013-08-24T18:21:48.793 に答える