注释 Comments

Sass 注释的工作方式在 SCSS 和缩进语法之间有很大的不同。 这两种语法都支持两种类型的注释:使用 `/* */` 定义的注释(通常)编译为 CSS,以及使用 `//` 定义的注释,但不是。

In Scss

SCSS 中的注释与其他语言(如 JavaScript)中的注释类似。 单行注释// 开头,一直到行尾。 单行注释中的任何内容都不会作为 CSS 发出; 就 Sass 而言,它们可能不存在。 它们也被称为无声评论,因为它们不产生任何 CSS。

多行注释/* 开始,到下一个 */ 结束。 如果多行注释写在允许 statement 的地方,它会被编译为 CSS 注释。 它们也被称为 大声评论,与沉默评论形成对比。 编译为 CSS 的多行注释可能包含 interpolation,它将在编译注释之前进行评估。

默认情况下,多行注释将从压缩模式 中编译的 CSS 中删除。 但是,如果注释以 /*! 开头,它将始终包含在 CSS 输出中。

scss
Scss
scss
// 此注释不会包含在 CSS 中。

/* 但是这个注释会,除了在压缩模式下。 */

/* 它也可以包含插值:
 * 1 + 1 = #{1 + 1} */
/*! 即使在压缩模式下也会包含此注释。 */

p /* 多行注释可以写在任何地方
   * 允许空格。 */ .sans {
  font: Helvetica, // 单行注释也可以。
        sans-serif;
}

In Sass

缩进语法中的注释有点不同:它们是基于缩进的,就像其他语法一样。 与 SCSS 一样,用 // 编写的静默注释永远不会作为 CSS 发出,但与 SCSS 不同的是,在开头 // 下缩进的所有内容也会被注释掉。

/* 开头的缩进语法注释与缩进的工作方式相同,只是它们被编译为 CSS。 因为注释的范围是基于缩进的,所以结束的 */ 是可选的。 与 SCSS 一样,/* 注释可以包含 interpolation 并且可以以 /*! 开头以避免在压缩模式下被剥离。

也可以在缩进语法的 表达式 中使用注释。 在这种情况下,它们的语法与 SCSS 中的语法完全相同。

sass
Sass
sass
// 此注释不会包含在 CSS 中。
    这也被注释掉了。

/* 但是这个注释会,除了在压缩模式下。

/* 它也可以包含插值:
   1 + 1 = #{1 + 1}

/*! 即使在压缩模式下也会包含此注释。

p .sans
  font: Helvetica, /* 行内评论必须关闭。 */ sans-serif

文档注释

使用 Sass 编写样式库时,您可以使用注释来记录 mixinsfunctions变量占位符选择器您的图书馆提供的,以及图书馆本身。 这些评论由 SassDoc 工具读取,该工具使用它们生成精美的文档。 查看 Susy 网格引擎 的文档以了解它的实际应用!

文档注释是无声注释,用三个斜杠 (///) 写在您正在记录的内容的正上方。 SassDoc 将注释中的文本解析为 Markdown,并支持许多有用的 注释 以对其进行详细描述 .

scss
Scss
scss
/// 计算指数。
///
/// @param {number} $base
///   要自相乘的数。
/// @param {integer (unitless)} $exponent
///   要相乘的 `$base` 的数量。
/// @return {number} `$base` to the power of `$exponent`.
@function pow($base, $exponent) {
  $result: 1;
  @for $_ from 1 through $exponent {
    $result: $result * $base;
  }
  @return $result;
}