是否可以在css中使用多種鏈接樣式？

這可能嗎？我已經看遍了谷歌，無法找到我正在尋找的答案。這裏的問題：是否有可能像我們說的div標題中的文本有紅色懸停，並在頁腳的div中的文本白色懸停？是否可以在css中使用多種鏈接樣式？

或者這是不可能的，你能爲整個文件只設置1種風格嗎？

我希望我解釋得很好。

在此先感謝！

2011-09-27 Alexander Vaz

這是非常可能的，就像任何其他的元素，你可以通過更具體的單獨樣式。

如果你有這樣的HTML：

<div id="top"> 
    <a href="#">First link</a> 
</div> 

<div id="bot"> 
    <a href="#">Second link</a> 
</div>

有了這個CSS，你會風格都鏈接：

a:hover { 
    color: #000; 
}

有了這個CSS，你可以單獨他們的風格：

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

#bot a:hover { 
    color: #fff; 
}

來源

2011-09-27 08:03:56 Kokos

唉唉OKE太棒了！而且，呃鏈接，主動，被訪問的作品也是一樣的權利？我只是使用這樣的一條線：#top a，鏈接，訪問，活動？每天都會更加明智：D謝謝你和其他人在這裏幫助我：D –

@AlexanderVaz作品一樣，是的。但是你應該注意''#top .one，.two'在'＃top'裏面的'.one'和任何**'.two';你會希望'#top .one，#top .two'。 – ANeves

Yea Alexander，如果您只需輸入'a'，您將同時設置'link'，'visited'，'hover'和'active'。然後，您可以將其他人單獨設置爲需要更改的人。 – Kokos

那麼你只需選擇a：鏈接的元素，並應用那樣的樣式。

即

#header a:hover { color: red; } 
#footer a:hover { color: white; }

來源

2011-09-27 08:03:50 MassiveAttack

是的，這是可能的。

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

#footer a:hover { 
    color: #0f0; 
}

http://jsfiddle.net/wrygB/2/

您可能需要分割這雖然這樣你就可以在其他地方使用相同的懸停。在這種情況下，你會這樣做：

.main:hover { 
    color: #f00; 
} 

.sub:hover { 
    color: #0f0; 
}

然後，您可以將main或sub類應用於任何元素以獲得懸停效果。

來源

2011-09-27 08:04:40 Gazler

這不會工作，'一'元素不會從父類繼承顏色，因此需要專門針對它們。 – Kokos

我提供了一個工作示例。如果你認爲那麼你會發現它確實有效。 – Gazler

@Gazler您的示例不使用標籤。在裏面放一個標籤，你會看到Kokos在說什麼。 –

您可以設置幾乎一樣多，只要你想，如果你只是把它掛右：

/* every a:hover has color red */ 
    a:hover { color: red; } 
/* #footer a:hover has color green. */ 
    #footer a:hover { color: green; } 
/* Every link that has class ".ThisClass" will have yellow color */ 
    a.ThisClass:hover { color: yellow; }

來源

2011-09-27 08:05:20 Joonas

感謝您的幫助！ –

是否可以在css中使用多種鏈接樣式？

回答

相關問題