2012-01-19 10 views
77

異なる色の単語(hrefリンク)でナビゲーションメニューを作成しています。どんな状態でも色を変更しないようにしたいです(ホバー、訪問したなど)。ハイパーリンクからすべてのスタイリング/書式設定を削除する

私はさまざまな州の色を設定する方法を知っていますが、そのままテキスト色(およびその他のスタイル/書式)をそのまま残すコードを知りたいと思います。

何か提案がありますか?

答えて

132

あなたは単にa:hoverを上書きすることになる、リンクのスタイルを定義することができ、a: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 */ 
} 
+3

重要な部分は 'inherit'キーワードです。残念ながら100%のサポートはありません。 – david

+2

'initial'は、デフォルトのスタイルにCSSをリセットする場合にも役立ちます。これはここでよく説明されています。[link](http://stackoverflow.com/questions/8228980/reset-css-display-property-to-default-value) – SiteHopper

+0

'inherit'に感謝します! – parsecer

-1

あなたがホバリングして、このような追加a.redLink:hover{color:red;}でこれを維持するために、その後a.redLink{color:red;}を述べる場合、これは他のホバー状態はあなただけのすべてを定義するために、あなたのスタイルシートにaセレクタを使用することができ、あなたのリンク

1

の色を変更しないだろうことを確認しますアンカー/ハイパーリンクの状態。例:

a { 
    color: blue; 
} 

すべてのリンクスタイルを上書きし、すべての状態を青色にします。

+0

これは彼が尋ねたものではありません。質問をもう一度読んでください。彼はすでにこれを知っています。 – david

2

Chrisが私の前で言ったように、ちょうどaがオーバーライドする必要があります。たとえば:.nav aは常に緑のだろう。この例では

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

、:ホバーは、それには適用されません。

これに影響する他のルールがある場合は、!importantを使用することができますが、そうしないでください。落ち込むのは悪い習慣です。

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

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

+0

これは彼が尋ねたものではありません。質問をもう一度読んでください。彼はすでにこれを知っています。 – david

+0

@david私は彼が尋ねたものだと確信しています。このコードでは、 ':hover'(または':visited'など)の変更を防ぐ 'a'のスタイルを設定することができます。あなたは実際の解決策を提案する3つの答えのすべてをかわいそうとする代わりにいかがですか? – SpoonNZ

+0

助けてくれてありがとう。しかし、リンクがこれのようなものならどうでしょうか? 2つの言葉が2色で表示されますが、それはただ1つのリンクです: ユニークな(ピンクの)売り上げ(黒い) そして、彼らはどんな状態でもその色を保つべきです。 この方法でインラインでコード化しました... uniquesales ただし、クリーナーが必要です。 (そこにコードのような多くのリンクがあります) 何か提案がありますか? – SiteHopper

関連する問題