如何在不使用 mixin 的情况下重用 sass 中的类？ [复制]

Posted 2023-03-06

【中文标题】如何在不使用 mixin 的情况下重用 sass 中的类？ [复制]

【英文标题】：How to reuse a class in sass without using a mixin? [duplicate]

【发布时间】：2012-07-09 03:45:25

【问题描述】：

我希望我的应用程序中的所有锚点看起来像 .btn（Twitter Bootstrap 类），有没有办法做到这一点？

我做到了

a
  @include btn;

但它不起作用，因为 btn 应该是一个 mixin，而且它是一个 Twitter Bootstrap 类。

【参考方案1】：

这正是你想要的 => https://github.com/thomas-mcdonald/bootstrap-sass

安装 gem bootstrap-sass 在config.rb => require 'bootstrap-sass' @import "bootstrap"; 在 scss 文件的顶部。

使用写入

a 
  @extend .btn;

【讨论】：

我已经安装了 bootstrap-sass

【参考方案2】：

您想使用@extend .btn; - @extend 允许您继承选择器的所有属性，而无需将其定义为 mixin。

【讨论】：

我做了一个@extend .btn;，编译出来的css没有一个，怎么回事？

您能否编辑您的问题以显示您的主应用程序 CSS 的内容？主要是我想看看//=require 指令，或者如果你正在使用@import 命令。

不使用mixin有什么好处？

@extend 不能在媒体查询中使用。如果我想在媒体查询中使用来自外部库的类（如物化），@extend 不是一个选项，也不能进入库代码并将类声明更改为 mixin 声明。在这种情况下没有选择吗？其他预处理器可以像使用 mixin 一样使用普通类。