scss 中 % 符号有何用途？

scss 中 % 表示什么？

在给定的 scss 片段中：

%style {
  width: 100px;
  height: 30px;
  line-height: 28px;
  vertical-align: middle;
}

% 符号表示 占位符选择器。它与常规 id 或类选择器类似，但使用 % 符号替换了 # 或 . 符号。

占位符选择器的用途

占位符选择器用于定义可重用的 css 属性集，这些属性集可通过 @extend 指令在其他选择器中使用。这允许在代码中维护一致的样式，并简化对样式属性的更改。

用法

要使用占位符选择器，您需要：

1. 使用 % 符号定义选择器，例如 %style。
2. 在您想要重用属性集的其他选择器中使用 @extend 指令，例如：

.button {
  @extend %style;
}

注意

当占位符选择器单独使用时（即未通过 @extend 调用），它不会编译到 css 输出中。

以上就是scss 中 % 符号有何用途？的详细内容，更多请关注其它相关文章！