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。为什么？

回答

相关问题