为除 2 个按钮之外的所有按钮设置样式答案

【问题标题】：Style all buttons except 2 buttons为除 2 个按钮之外的所有按钮设置样式
【发布时间】：2020-01-03 01:43:44
【问题描述】：

.button , button{
border:solid black 2px !important;
}

通过这段代码，我为所有按钮提供了一个框架。但是，我不想为按钮“searchsubmit”和“single_add_to_cart_button”设置框架。我该怎么做？

【问题讨论】：

【解决方案1】：

没那么难。

有两种方法，第一种更简单，推荐！

.noBorderButton{
      border : none !important;
}

在您的 HTML 中，您可以将“noBorderButton”类添加到您的按钮中。

<button class="noBorderButton">Search Submit</button>

附：确保遵循 CSS 覆盖规则，即在 Button CSS 下方编写 .noBorderButton CSS。

编辑：正如我所见，Martin 建议这将改变用户代理样式，并且按钮根本不会有任何边框，而且您可能也不希望这样！

您可以选择以下选项

button:not(.noBorderButton){
border:solid black 2px !important;
}

是的，再次将“noBorderButton”类添加到您不希望这些样式在其中起作用的那些按钮。

【讨论】：

【解决方案2】：

我相信这些是你的班级名称。如果是，那么您可以添加边框：无！重要。

button.searchsubmit, 
button.single_add_to_cart_button {
   border: none !important;
}

【讨论】：

【解决方案3】：

简单地做：

班级：
.searchsubmit {border:none;!important} 和 .single_add_to_cart_button {border:none;!important}

ID：
#searchsubmit {border:none;!important} 和 #single_add_to_cart_button {border:none;!important}

它可以更干净，但这适用于... :)

【讨论】：

【解决方案4】：

你可以使用 not css 选择器

.button , button:not(.searchsubmit):not(.single_add_to_cart_button) {
   border:solid black 2px !important;
}

【讨论】：

【解决方案5】：

这很简单，您可以使用 :not 选择器来忽略具有您特定类的两个按钮：

.button , button , button:not('single_add_to_cart_button') , button:not('searchsubmit') {
border:solid black 2px !important;
}

或者你可以用我不推荐的相反方式来做，就像你给一个按钮设置一个边框然后你取消它：

button.searchsubmit , button.single_add_to_cart_button {
   border: none !important;
}

（当然，上面的样式必须在您的 .button 和 button 样式之后才能覆盖它）

【讨论】：