Html 如何排除css中的特定类？

以下是我的css：

.single-post .container {
    width: 60%;
}

not(.single-post) .container{
            min-width:92%;
    }

我努力实现的目标是： 我希望容器的宽度是60%的单后页和92%的每其他页面。所以，我试图通过使用not（.single post）将.single post类从第二行代码中排除，但它不起作用

然而，第一行代码运行良好

:not(.single-post) .container{
        min-width:92%;
}

应添加

：

其次，您可能需要添加

！重要信息

在

92%之后

所以最终的代码是

:not(.single-post) .container{
        min-width:92% !important;
}

应添加

：

其次，您可能需要添加

！重要信息

在

92%之后

所以最终的代码是

:not(.single-post) .container{
        min-width:92% !important;
}

---

据我所知，不能在嵌套类上使用：not（）

您可以尝试使用

！重要信息

关于单篇文章

.container {
  background-color: lightblue;
  margin: 1em 0;
  padding: 1em;
  width: 92%;
}

.single-post .container {
  width: 60% !important;
}

工作小提琴：

---

请注意，您必须使用相同的CSS引用。

据我所知，您不能在嵌套类上使用：not（）

您可以尝试使用

！重要信息

关于单篇文章

.container {
  background-color: lightblue;
  margin: 1em 0;
  padding: 1em;
  width: 92%;
}

.single-post .container {
  width: 60% !important;
}

工作小提琴：

---

请注意，您必须使用相同的CSS引用。

您可以先声明一般情况，然后再声明更具体的情况。声明的顺序很重要（级联）。运行以下示例以检查它

.container{
宽度：92%；
背景颜色：蓝色；
}
.单柱集装箱{
宽度：60%；
背景色：红色；
}

您可以先声明一般情况，然后再声明更具体的情况。声明的顺序很重要（级联）。运行以下示例以检查它

.container{
宽度：92%；
背景颜色：蓝色；
}
.单柱集装箱{
宽度：60%；
背景色：红色；
}

假设

.single post

类位于

body

元素或另一个父元素上，您可以编写以下内容：

.container{
宽度：92%；
}
.单柱集装箱{
宽度：60%；
}

---

这将在所有页面上将

.container

元素的宽度设置为

92%

，但在

.single post

页面上时除外，其中，它将被设置为

60%

，因为该规则集是在级联中稍后定义的，并且比以前的规则集更为具体。

假设

.single post

类位于

主体

元素或另一父元素上，您可以编写以下内容：

.container{
宽度：92%；
}
.单柱集装箱{
宽度：60%；
}

---

这将在所有页面上将

.container

元素的宽度设置为

92%

，但在

.single post

页面上时除外，其中，它将被设置为

60%

，因为该规则集是在级联中稍后定义的，并且比以前的规则集更为具体。

现在，单篇文章页面在容器中的宽度也为92%。所以，它没有排除。单篇文章类。你可以共享实时url以便我查看吗？现在单篇文章页面在容器中也有92%的宽度。所以，它没有排除.single post类。你能共享实时url吗？single post类是在

.container

元素上，还是在父元素上？single post类是在

.container

元素上，还是在父元素上？啊，你比我抢先一步。向上投票。啊，你赢了我。向上投票。