web-dev-qa-db-ja.com

ハイパーリンクからすべてのスタイリング/フォーマットを削除します

さまざまな色の単語(hrefリンク)を含むナビゲーションメニューを作成しています。どの状態(ホバー、訪問済みなど)でも色が変わらないようにしたいです。

さまざまな状態の色を設定する方法は知っていますが、テキストの色(およびその他のスタイル設定/書式設定)をそのままにしておくためのコードを知りたいです。

助言がありますか?

116
SiteHopper

リンクのスタイルを定義するだけで、a:hovera:visitedなどをオーバーライドできます。

a {
  color: blue;
  text-decoration: none; /* no underline */
}

代わりに親スタイルの属性を使用する場合は、inherit値を使用することもできます。

body {
  color: blue;
}
a {
  color: inherit; /* blue colors for links too */
  text-decoration: inherit; /* no underline */
}
191
Frxstrem

クリスが前に言ったように、aだけをオーバーライドする必要があります。例えば:

a { color:red; }
a:hover { color:blue; }
.nav a { color:green; }

この場合、.nav aは常に緑色で、:hoverは適用されません。

他のルールが影響している場合は、!importantを使用できますが、使用しないでください。それに陥るのは悪い習慣です。

.nav a { color:green !important; } /*I'm a bad person and shouldn't use !important */

その後、常に緑色になり、他のルールとは無関係になります。

3
SpoonNZ

スタイルシートでaセレクターを使用するだけで、アンカー/ハイパーリンクのすべての状態を定義できます。例えば:

a {
    color: blue;
}

すべてのリンクスタイルをオーバーライドし、すべての状態を青色にします。

1
Chris