css .class不能在錨標記上工作，除非我添加a.class。爲什麼？

我有一個簡單的CSS類，我使用風格的按鈕和錨標籤，但有一些奇怪的。css .class不能在錨標記上工作，除非我添加a.class。爲什麼？

.green 
{ 
    background-color: #35db22; 
    color:white; 
}

當我將它應用到按鈕時，它工作正常。但是當我嘗試將它應用到錨標記時，它不會，而其他類像我的'按鈕'類在錨標記上工作。

<a class="button green">green</a>

雖然我在調試這個，我發現了它並通過增加a.green到類選擇工作：

.green, a.green 
{ 
    background-color: #35db22; 
    color:white; 
}

難道我是認爲這是奇怪的唯一一個？這是爲什麼發生？我有這些類的多很多，因此添加到所有這些需要花費大量的時間... :(

任何想法是怎麼回事？或者這只是在CSS中的錯誤？

編輯

這裏的一些更多的CSS，因爲ZachSaucier問它：

/*CONTROLS*/ 
button, a.button, input[type="submit"], input[type="button"] 
{ 

    text-align:center; 

    min-height:20px; 
    min-width:100px; 
    font-size:20px; 

    border: none; 
    padding: 5px; 
    background-color: darkgray; 
    color: black; 
    text-decoration: none; 

    -moz-transition: all 0.5s ease-out; 
    -o-transition: all 0.5s ease-out; 
    -webkit-transition: all 0.5s ease-out; 
    transition: all 0.5s ease-out; 
} 
button:hover, a.button:hover, input[type="submit"]:hover, input[type="button"]:hover 
{ 
    background-color:gray; 
    color:whitesmoke; 
} 

button:active, a.button:active, input[type="submit"]:active, input[type="button"]:active 
{ 
    background-color:black; 
    color:white; 
} 


.green 
{ 
    background-color: #35db22; 
    color:white; 
}

我是一個CSS的初學者，所以這可能是明顯的東西...

來源

2014-10-11 JoJo

這可能是由於選擇者的特異性。另一個規則可能是壓倒原文。我們將不得不看你所有的CSS或演示來證實這一點。 – 2014-10-11 15:31:01

我猜測你以後在你的CSS中定義'.button'，或許？ – 2014-10-11 15:32:50

@ZachSaucier所有的CSS？這很多，但沒關係。 – JoJo 2014-10-11 15:33:30

它或者在.green定義之後的某處存在.button規則，該規則覆蓋了.green規則。

或者有一個a.button規則，它比.green更具體，它覆蓋了.green類。

通過更改.green類a.green您正在使選擇器更具體，a.green選擇器現在的瀏覽器更重要。

您可以檢查您正在使用的任何瀏覽器的開發人員工具，並檢查看看什麼覆蓋了.green類中的值。您通常可以通過按F12打開開發人員工具，我確信您可以找到有關開發人員工具的信息以及如何在Web上使用它。

來源

2014-10-11 15:38:48

非常感謝你！確實有一個a.button類。 – JoJo 2014-10-11 15:42:48

css .class不能在錨標記上工作，除非我添加a.class。爲什麼？

回答

相關問題