OOCSS /模塊化CSS：戰鬥鏈接風格，如何解決？

在我的CSS文件，作爲一個「復位」的一部分，我的風格像這樣所有鏈接：OOCSS /模塊化CSS：戰鬥鏈接風格，如何解決？

a { 
    color: blue; 

    &:visited { 
    color: violet; 
    } 

    &:hover, 
    &:focus, 
    &:active { 
    color: orange; 
    } 

}

我知道這些都是非常寬泛的規則針對網頁上的所有鏈接，但這是他們的默認外觀，所以我想應該可以像這樣做（甚至是需要！）。

現在，我的導航看起來是這樣的：

<ul class="nav"> 
    <li><a href="#" class="nav__a">Link 1</a></li> 
    <li><a href="#" class="nav__a">Link 2</a></li> 
    <li><a href="#" class="nav__a">Link 2</a></li> 
</ul>

有了相應的CSS：

.nav__a { 
    color:green; 
}

遺憾的是，只有未訪問鏈接會顯示綠色時，已經訪問過的人仍然紫色。
我發現增加!important會「解決」問題，但那不是很乾淨。

當然，我所能做的

.nav__a, 
.nav__a:visited { 
    color: green; 
}

但似乎相當臃腫 - 我需要做的是另一條鏈路狀態了。

有沒有辦法做到這一點，或者它是正常的行爲 - 也許有關模塊化CSS我的方法有問題嗎？

來源

2015-01-04 Sven

不要在第一時間重置。（當然，你也可以不使用整個「OOCSS」'.nav__a'這個東西，哪種類型的CSS失敗 - '.nav a'本來可以正常工作，因爲它和'a：visited '。） – Ryan

@ U2744SNOWFLAKE好吧，但是當我不做重置的時候，我所有的鏈接都會有UA的默認顏色，這可能不是我想要的，所以我必須這樣做？ – Sven

你有特定的藍色，紫色和橙色意圖嗎？ – Ryan

這種替換代碼：

a.nav__a{ 
    color:green; 
}

我希望能爲你工作

來源

2015-01-04 20:50:00 ambes

我@ambes同意。

設置

a.nav__a{ 
    color:green; 
}

將所有與錨的僞國color:green;

你是正確的，以避免使用！重要的。而且你也可以將元素的範圍劃分爲塊（BEM）。起初它可能會感到奇怪，但這是正確的。幹得不錯！保持好狀況！

來源

2015-09-19 14:39:14

OOCSS /模塊化CSS：戰鬥鏈接風格，如何解決？

回答

相關問題