1、sass语法 1.1 css的编译模式 css --- 普通 sass / scss --- 高效 // ********* less --- 高效 1.2 sass介绍 来源: ruby语言 基础的版本,后缀名为sass:没有{},只能通过缩进来实现 -- 可读性差、难以维护 // css .box {width: 100px} // .sass .box width: 100px; // 据说是这样 .scss 后缀 --- 可读性高、便于维护 html { background: red } // scss语法--嵌套 --- 权重 .box { color: blue; .test { font-size: 20px; } } // ==》 .box {color: blue;} .box .test { font-size: 20px;} 1.3 如何使用scss 最终需要使用的是css文件,编写的scss文件 转换工具 gulp / webpack / ruby工具 / 编辑器插件 选用gulp来处理scss文件 2、sass用法 2.1 安装 sass 模块 cnpm i gulp-sass -S (推荐) cnpm i gulp-sass-china -S 2.2 配置处理scss文件gulp的任务 gulp.task('scss2css', () => {