sass 速查手册 - [ 实战篇]

1. 安装

click sass install sass环境配置 ;我这里略过~ 直接实战

2. sass命令使用

//cmd 输出文件
sass sass/style.scss:css/style.css

//cmd 文件监听
sass --watch sass:css

//cmd  代码紧凑格式
sass --watch sass:css --style compact

//cmd  代码压缩格式
sass --watch sass:css --style compressed

//cmd  代码易于阅读的扩展格式
sass --watch sass:css --style expanded

那么现在问题来了 这些命令怎么在JetBrains WebStorm 2018.1 x64.exe中 watch文件呢?

↑ 具备sass 编译环境之后 ;把想要的sass编译指令 添加或替换 到 红框位置;

3. sass与scss区别

3.1 快速使用

变量

3.2 嵌套 > 时调用父选择器

3.3 嵌套 > 属性嵌套

3.4 混合mixin

3.5 继承

3.6import 多模块引入

3.7 注释

3.8 Date类型& 运算 & string

其他一些颜色函数
rgb 与 rgba
hsl 与 hsla
adjust-hue
lighten 与 darken
saturate 与 desaturate
opacify 与 transparentize

3.9 list

3.10 map

3.11 布尔值

Interpolation 值插入

---

4. 控制指令 Control Dirctives

4.1 @if

4.2 @for

4.3 @each

4.4 @while

---

5. function