之間的衝突我有一個使用圖片的鏈接導航欄,如下所示:CSS:-webkit-過濾器和過濾
<nav>
<ul>
<li>
<a href="#link">
<img src="img/link.png">
</a>
</li>
</ul>
</nav>
要創建圍繞未訪問鏈接的光暈,我有以下的CSS:
nav a img {
-webkit-filter: drop-shadow(0px 0px 8px #fff);
-o-filter: drop-shadow(0px 0px 8px #fff);
-ms-filter: drop-shadow(0px 0px 8px #fff);
filter: drop-shadow(0px 0px 8px #fff);
}
nav a:visited img {
-webkit-filter: none;
-o-filter: none;
-ms-filter: none;
filter: none;
}
在Chrome中,該nav a img
規則適用-webkit-filter: drop-shadow(0px 0px 8px #fff);
和nav a:visited img
規則適用filter: none;
,結果該鏈接已被訪問之後也煥發仍然存在。
有什麼我可以做這件事?
在Firefox上,nav a:visited img
規則根本沒有被確認。大概這是由於privacy concerns。
有沒有辦法讓未訪問的鏈接圖像發光,並訪問的鏈接圖像不發光?
相關 - http://stackoverflow.com/questions/34827812/styling-visited-links-belonging-to-a-class?answertab=votes#tab-top –