📌  相关文章
📜  Sass-评论

📅  最后修改于: 2020-10-20 05:40:46             🧑  作者: Mango

在本章中，我们将研究有关Sass评论。注释是不可执行的语句，放置在源代码中。注释使源代码更易于理解。 SASS支持两种类型的注释。

  • 多行注释-这些注释使用/ *和* /编写。多行注释保留在CSS输出中。

  • 单行注释-这些注释使用//编写，后跟注释。单行注释不会保留在CSS输出中。

例

以下示例演示了SCSS文件中注释的使用-

SASS comments
      
   

   
      
Welcome to TutorialsPoint

      TutorialsPoint

接下来，创建文件style.scss 。

style.scss

/* This comment is
 * more than one line long
 * since it uses the CSS comment syntax,
 * it will appear in the CSS output. */
body { color: black; }

// These comments are in single line
// They will not appear in the CSS output,
// since they use the single-line comment syntax.
a { color: blue; }

您可以使用以下命令，让SASS监视文件并在SASS文件更改时更新CSS-

sass --watch C:\ruby\lib\sass\style.scss:style.css

接下来，执行以上命令；它将使用以下代码自动创建style.css文件-

style.css

/* This comment is
 * more than one line long
 * since it uses the CSS comment syntax,
 * it will appear in the CSS output. */
body {
   color: black; }

a {
   color: blue; }

输出

让我们执行以下步骤，看看上面给出的代码如何工作-

  • 将上面给定的html代码保存在sass_comments.html文件中。

  • 在浏览器中打开此HTML文件，显示输出，如下所示。

萨斯评论

要研究多行注释中的插值，请单击此链接。

Sass –多行注释中的插值

描述

多行注释中的插值将在结果CSS中解析。您可以在花括号内指定变量或属性名称。

句法

$var : "value";
/* multiline comments #{$var} */

例

以下示例演示了SCSS文件中多行注释中插值的使用-

SASS comments
      
   

   
      
Welcome to TutorialsPoint

      
This is an example for Interpolation in SASS.

接下来，创建文件style.scss 。

style.css

$version: "7.8";
/* Framework version for the generated CSS is #{$version}. */

您可以使用以下命令，让SASS监视文件并在SASS文件更改时更新CSS-

sass --watch C:\ruby\lib\sass\style.scss:style.css

接下来，执行以上命令；它将使用以下代码自动创建style.css文件

style.css

/* Framework version for the generated CSS is 7.8. */

输出

让我们执行以下步骤，看看上面给出的代码如何工作-

  • 将上面给定的html代码保存在sass_comments_interpolation.htm文件中。

  • 在浏览器中打开此HTML文件，显示输出，如下所示。

萨斯评论