2013-04-26 79 views
0

我有一個一般的css規則的鏈接,工作正常,直到我把例外。在這個簡化的特定情況下,一般鏈接應該是黑色的,例外應該是紅色的。但是當我添加「.menu a:link」時,一切都變紅了。在Safari和ul鏈接

問題出在Safari上,而不是其他瀏覽器。在像FsFiddle或JsBin這樣的地方一切都很好。

我做錯了什麼?

HTML:

<ul class="menu"> 
    <li><a href="#">should be red</a></li> 
    <li><a href="#">should be red</a></li> 
    <li><a href="#">should be red</a></li> 
</ul> 

<a href="aligues.html"> should be black </a> <br> 

CSS:

a { outline:0; text-decoration: none ; } 
a:link, a:visited { color: black; } 
a:hover { color: black;text-decoration: none; } 

.menu a:link, a:visited { color: red; } 
.menu a:hover { color: red;text-decoration: none; } 

回答

2

請注意,你有沒有跟.menu前置你a:visited選擇。

我要去猜測,具體的線路應該是這樣的:

.menu a:link, 
.menu a:visited { color: red; } 

的原因,它只是在Safari紅色,因爲這是訪問aligues.html唯一的瀏覽器。

+0

就是這樣!我一直在這個愚蠢的錯誤幾個小時,你在幾分鐘內解決。非常感謝! – Nrc 2013-04-26 14:31:24

+0

這兩個答案都是完美的,同時。系統不讓我選擇 – Nrc 2013-04-26 14:34:25

+0

作爲提示;在CSS中的每個逗號後加一個換行符。即使你在線上的屬性,它會立即出現如此明顯的錯誤。或者使用像LESS/SCSS這樣的CSS預處理器。 – sg3s 2013-04-26 14:41:29

3

看起來好像有一條規則你可能沒有意識到會產生影響。

.menu a:link, a:visited { color: red; } 

該規則實際上指定菜單內的所有鏈接都是紅色以及已訪問的所有鏈接。因此,您似乎可能訪問過網頁上的其他鏈接,Safari只是將它們標記爲已讀?

我創建了一個JSFiddle,它顯示了ul之外的鏈接以及您可能訪問過的網址,它應顯示爲紅色。解決方法是使選擇器不那麼通用。例如:

.menu a:link, .menu a:visited { color: red; } 
+0

就是這樣!我一直在這個愚蠢的錯誤幾個小時,你在幾分鐘內解決。非常感謝! – Nrc 2013-04-26 14:31:49

+0

這兩個答案都是完美的,同時。系統不讓我選擇 – Nrc 2013-04-26 14:33:31

+0

@Nrc不是問題,很高興你有你的答案! – cchana 2013-04-28 18:42:27