Css 仅扩展Sass上的第一级

我有几句俏皮话：

.content{
   width: 960px;
   padding: 15px 0;
   margin: auto;
   background: inherit;

   p{
       text-align: justify;
       padding: 10px;
   }
}

在某些地方，我想用.content扩展一个类，如下所示：

.header{
    position: relative;
    @extend .content;
}

---

问题是它显然还扩展了“.content2”中的“p”标记，但这对我来说是个问题，因为我在“.header”中有一个“p”标记，我不希望它继承填充和文本对齐，我不知道是否可以只继承“.content”的第一级（从宽度到背景）.

否。如果扩展一个选择器，则扩展具有相同名称的所有选择器（包括

.foo.content

）。最好的选择是从多个选择器扩展：

%foo {
   width: 960px;
   padding: 15px 0;
   margin: auto;
   background: inherit;
}
.content {
   @extend %foo;
   p {
       text-align: justify;
       padding: 10px;
   }
}

.header {
    @extend %foo;
}

---

你可以在你的

.header

声明中覆盖

.header p

。我不认为有办法只选择顶层？这实际上是我想要避免的，我不想创建一个新类，这就是为什么我最后提出这个问题的原因。