qq_22187895的专栏

1.函数作用把一些比较复杂或经常用些的内容进行抽离（封装），以便重复使用2.函数的定义与使用函数的定义提示：函数名function-name 与function_name 是相同的@return它只允许在@函数体中使用，并且每个@function必须以@return结束。当遇到@return时，它会立即结束函数并返回其结果。函数的使用3.函数的参数与默认值正常传参调用省略默认值按照参数名传参注意：函数参数默认值可以是任意SassScript表达式，甚至可以引用前面的参数。

for 指令可以在限制的范围内重复输出格式，每次按要求（变量的值）对输出结果做出变动。这个指令包含两种格式：@for $var from through ，或者 @for $var from to。@each 指令的格式是 $var in , $var 可以是任何变量名，比如 $length 或者 $name，而 是一连串的值，也就是值列表。这样可以实现比 @for 更复杂的循环。@if()函数允许您根据条件进行分支，并仅返回两种可能结果中的一种。而使用to 时条件范围只包含的值不包含 的值。

sass包含很多操作颜色的函数。例如：lighten() 与 darken()函数可用于调亮或调暗颜色，opacify()函数使颜色透明度减少，transparent()函数使颜色透明度增加，mix()函数可用来混合两种颜色。数值函数处理数值计算，例如：percentage()将无单元的数值转换为百分比，round()将数字四舍五入为最接近的整数，min()和max()获取几个数字中的最小值或最大值，random()返回一个随机数。1.Color(颜色函数)3.Math(数值函数)

如果需要使用变量，同时又要确保 / 不做除法运算而是完整地编译到 CSS 文件中，只需要用 #{} 插值语句将变量包裹。引入之前的案例发出一个问题。

在设计网页的时候通常遇到这样的情况：一个元素使用的样式与另一个元素完全相同，但又添加了额外的样式。你可能发现被继承的css父类并没有被实际应用，也就是说html代码中没有使用该类，它的唯一目的就是扩展其他选择器。对于该类，可能不希望被编译输出到最终的css文件中，它只会增加CSS文件的大小，永远不会被使用。当在Sass文件中使用占位符选择器时，它可以用于扩展其他选择器，但不会被编译成最终的CSS。占位符选择器类似于类选择器，但是，它们不是以句点(.)开头，而是以百分号(%)开头。这就是占位符选择器的作用。

混合指令（Mixin）用于定义可重复使用的样式。混合指令可以包含所有的 CSS 规则，绝大部分 Sass 规则，甚至通过参数功能引入变量，输出多样化的样式。1.定义与使用混合指令 @mixin例1：标准形式定义使用例2：嵌入选择器例如使用例3：使用变量定义使用例4：使用变量（多参数）例如使用一使用二使用三：只设置两边问题：必须指定4个值例5：指定默认值定义使用例6：可变参数参数不固定的情况使用。

importSass 拓展了 @import 的功能，允许其导入 SCSS 或 Sass 文件。被导入的文件将合并编译到同一个 CSS 文件中，另外，被导入的文件中所包含的变量或者混合指令 (mixin) 都可以在导入的文件中使用。例如在index.scss里面使用注意：跟我们普通css里面@import的区别如下几种方式，都将作为普通的 CSS 语句，不会导入任何 Sass 文件文件拓展名是 .css；文件名以 http:// 开头；文件名是 url()；

footer {

为了便于管理这样的属性，同时也为了避免了重复输入，Sass 允许将属性嵌套在命名空间中。在嵌套 CSS 规则时，有时也需要直接使用嵌套外层的父选择器，例如，当给某个元素设定 hover 样式时，或者当 body 元素有某个 classname 时，可以用 & 代表嵌套规则外层的父选择器。有时，需要定义一套样式并不是给某个元素用，而是只通过 @extend 指令使用，尤其是在制作 Sass 样式库的时候，希望 Sass 能够忽略用不到的样式。例如有这么一段css，正常CSS的写法。改成写SASS的方法。