SASS - 除了一个属性外，如何为两个类分配相同的样式？答案

【问题标题】：SASS - How can I assign two classes the same style except one property?SASS - 除了一个属性外，如何为两个类分配相同的样式？
【发布时间】：2019-01-04 12:08:51
【问题描述】：

我有一个 SASS 样式表，我想为两个类（.class 和 .otherclass）分配相同的样式，除了一个属性（之前：）应该为 .otherclass 设置另一个值。

这是我目前拥有的代码：

.class, .otherclass {

    p { font-family:arial;
         &before: 
              @extend .class-one {}
    }

    ~ .extraclass {}
}

谢谢

【问题讨论】：

您只能重置该属性。如果您想从扩展中排除某个属性，请不要将其包含在原始定义中。
另外，您现有的代码未反映您对所需结果的描述。

标签： css sass styles

【解决方案1】：

说实话，我不确定你为什么不想编写两个不同的选择器，或者只是在第二个中覆盖一些属性。例如

.class1, .class2, .class3 {
  
  &:before{
    content: 'class';
  }
}

.class2:before {
  content: 'class2';
}

也许使用 :not 选择器会有所帮助：https://www.w3schools.com/cssref/sel_not.asp

.class1, .class2, .class3 {
  &:before {
    content: 'class'
  }
  &:not(.class1):before{
    content: 'class23'
  }
}

【讨论】：

谢谢你，虽然覆盖是 CSS 的理想选择，但我知道一点 SASS，但我应该问一下。
Sass、Less 和 Stylus 只是 CSS 的预处理器。使用 SCSS 时没有理由放弃 CSS 属性。纯 CSS 代码是有效的 SCSS 代码 :)

【解决方案2】：

请尝试看起来像：

.test{
  $color:#f00;
}
.demo{
  &:extend(.test);
}

【讨论】：