Sass 输出样式

Sass 输出样式用于指定文档结构的 CSS 样式。我们知道 Sass 文件会自动创建一个默认的 CSS 样式，该样式反映了文档的结构。默认的 CSS 样式并不适用于所有情况。

Sass 支持多种其他的输出样式

• 嵌套输出样式
• 展开输出样式
• 紧凑输出样式
• 压缩输出样式

嵌套输出样式

嵌套输出样式是 Sass 的默认输出样式。这种样式在处理大型 CSS 文件时非常有用。它使文件的结构更具可读性，并且易于理解。

让我们看一个嵌套 SCSS 文件的简单例子

展开输出样式

与嵌套 CSS 样式相比，展开输出样式的 CSS 占用更多空间。展开 CSS 样式的每个属性都占据一行。规则部分包含所有在规则中缩进的属性，而规则本身不遵循任何缩进。

让我们看一个展开 SCSS 文件的简单例子

紧凑输出样式

紧凑 CSS 样式比展开和嵌套输出样式占用更少的空间。它主要关注选择器而不是其属性。它将选择器及其属性放在同一行。嵌套规则彼此相邻放置，没有换行符，而不同的规则组之间会有换行符。

让我们看一个紧凑 SCSS 文件的简单例子

压缩输出样式

与上述所有其他输出样式相比，压缩 CSS 输出样式占用的空间最少。它仅提供空格来分隔选择器，并在文件末尾添加换行符。这种样式令人困惑，并且不易阅读。

让我们看一个压缩 SCSS 文件的简单例子