试试吧

SCSS格式化/压缩工具 - 在线SCSS格式化和SCSS压缩

SCSS格式化/压缩工具，选择SCSS代码缩进长度，上传或输入SCSS字符串，一键完成SCSS格式化和SCSS压缩，支持SCSS语法高亮和全屏显示。

第一步：请选择SCSS格式化的代码缩进长度。
请上传或输入SCSS字符串：
  操作文档

一、SCSS语法介绍

  • Sass是一款强化CSS的辅助工具，它在CSS语法的基础上增加了变量、嵌套、混合、导入等高级功能。SASS 3.0版本之前的后缀名为.sass，而SASS 3.0版本之后的后缀名是.scss。


1.1、SCSS格式美化语法示例

/* 试试吧代码示例 */
$sidebar-color: #fff;
$sidebar-width: calc(540px + 10%);
.sidebar {
  color: $primary-color;
  width: $sidebar-width;
  padding-left: calc($sidebar-width / 4);
}


二、SCSS格式化/压缩工具操作方式

  • SCSS格式化/压缩在线工具，主要用于在线对SCSS代码进行格式化和压缩操作，特色是支持文件上传下载，您也可以直接在线编辑SCSS代码，SCSS代码支持语法检测、SCSS代码自动补全和高亮显示。


2.1、SCSS格式化/压缩工具示例

首先，选择代码缩进长度，然后，上传或输入任意有效的SCSS文档，点击开始SCSS格式化/压缩即可，SCSS压缩示例：

$sidebar-color: #fff; $sidebar-width: calc(540px + 10%); .sidebar { color: $primary-color; width: $sidebar-width; padding-left: calc($sidebar-width / 4); }