.scss
Code
SCSS（Sassy CSS）
SCSS 是 Sass 的现代语法，Sass 是最流行的 CSS 预处理器。它使用 CSS 超集语法（大括号和分号），支持变量、嵌套、混入、函数和模块。SCSS 被 Bootstrap 5、Tailwind 构建工具和企业设计系统广泛使用。
MIME 类型
text/x-scss
类型
文本
压缩
无损
优点
- + CSS-compatible syntax — any CSS is valid SCSS
- + Powerful module system (@use, @forward) for large projects
- + Rich built-in functions for colors, math, and lists
- + Industry standard in enterprise design systems
缺点
- − Requires a compilation step (Dart Sass or build tool)
- − Native CSS custom properties and nesting reduce the need for SCSS
- − Large projects can have complex dependency graphs
何时使用 .SCSS
在复杂样式表、设计系统以及任何受益于变量、混入和模块化 CSS 架构的项目中使用 SCSS。
技术细节
SCSS 文件通过 Dart Sass（参考实现）编译为 CSS。功能包括 $variables、@mixin/@include、嵌套、@extend、@use/@forward 模块以及颜色、数学和字符串的内置函数。
历史
Hampton Catlin 于 2006 年创建了 Sass，采用基于缩进的语法。SCSS（Sassy CSS）在 Sass 3.0（2010）中引入，采用与 CSS 兼容的语法，很快成为主流的 Sass 风格。