SASS简介及使用方法

Sass（Syntactically Awesome StyleSheets）是一个CSS的扩展开发工具，它允许使用变量、条件语句等，使开发更简单可维护。使用Sass编写样式时，不是直接创建.css文件，而是创建一个.scss文件，按照Sass特定的语法格式来写样式。

Sass的基本语法包括：

1. 变量：Sass的变量名必须以符号开头，后面紧跟变量名。例如：color: red; div { color: color; }。特殊情况下，如果变量嵌套在字符串中，需要写在#{}符号里面。例如：side: left; div { border-#{$side}-radius: 5px; }。
2. 计算功能：Sass允许在代码中使用计算功能，例如：div { margin: (14px/2); top: 40px + 50px; right: $var * 10%; }。
3. 嵌套：SASS允许选择器嵌套，可以使代码结构更加清晰，层级分明。例如：div h2 { color: color; } 可以写成：div { h2 { color: color; } }。属性嵌套时，border后面必须加冒号。例如：div { border: { color: red; } }。在嵌套的代码块中，可以使用&引用父元素。