向多个元素添加css类

我创建了一个名为“button”的CSS类，并通过简单的方法将其应用于所有的INPUT标签：

.button input
{
//css stuff here
}

<p class="button">
<input type="submit" Name='submit' value="Confirm Selection"/>
</p>

它工作正常，但我又添加了一个按钮，但这不是我的形式的一部分，它只是一个占位符，与javascript，并打开一个iFrame。当我想要看起来和所有的“真实”按钮一样，我使用了同一个类。

<p class="button" id="AddCustomer">
<a href="AddCustomer.PHP">Add Customer</a>
</p>

我遇到的问题是，如果我离开课堂按钮，输入< a>标签没有看到它。如果我删除CSS的输入部分，我的所有按钮在中间都有灰色正方形。

所以我解决了.button输入，a

这工作正常。 。直到我看着另一个页面，并发现我的所有< a>标签现在使用“按钮”类进行格式化，即使它们没有应用此类。

我的问题是如何将相同的CSS类应用于< input>和< a>标签在同一时间，但只有当我明确添加了class =“按钮”。

解决方法

您也需要对选择器的一部分进行限定：

.button input,.button a {
    //css stuff here
}

基本上，当您使用逗号创建group of selectors时，每个单独的选择器是完全独立的。他们之间没有任何关系。

因此，您的原始选择器匹配“所有类型”input“的元素，它们是具有类名”button“的元素的后代，以及所有类型为”a“的元素。