sass运算符虽然没有像那些编程语言那么强大，但为了更灵活的输出css，也增强了一些运算符的功能，例如赋值运算符、等号操作符、比较运算符、逻辑运算符、字符串运算符...等等，接下来就来详细介绍下这些运算符的基本使用赋值运算符赋值运算符就是把一个值赋值给一个变量，通过冒号（：）的方式进行承接（很多编程语言是=），例如：$font-size:16px;也可以把一个变量赋值给另一个变量$font-size:16px;$h3:$font-size;赋值的变量必须先有值等号操作符等号操作符用于比较两个表达式的值是否相等，所有数据类型都支持等号运算符:符号说明==等于!=不等于例1：数字比较：$the
sass运算符虽然没有像那些编程语言那么强大，但为了更灵活的输出css，也增强了一些运算符的功能，例如赋值运算符、等号操作符、比较运算符、逻辑运算符、字符串运算符...等等，接下来就来详细介绍下这些运算符的基本使用赋值运算符赋值运算符就是把一个值赋值给一个变量，通过冒号（：）的方式进行承接（很多编程语言是=），例如：$font-size:16px;也可以把一个变量赋值给另一个变量$font-size:16px;$h3:$font-size;赋值的变量必须先有值等号操作符等号操作符用于比较两个表达式的值是否相等，所有数据类型都支持等号运算符:符号说明==等于!=不等于例1：数字比较：$the
Sass提供了许多内置模块，其中包含有用的函数（以及mixin）。这些模块可以像任何用户定义的样式表一样使用@use规则加载，它们的函数可以像任何其他模块成员一样调用。所有内置模块URL都以sass开头：表示它们是sass本身的一部分。常见函数简介，更多函数列表可看：https://sass-lang.com/documentation/modulesColor(颜色函数) sass包含很多操作颜色的函数。例如：lighten()与darken()函数可用于调亮或调暗颜色，opacify()函数使颜色透明度减少，transparent()函数使颜色透明度增加，mix()函数可用来混合两种颜色
Sass提供了许多内置模块，其中包含有用的函数（以及mixin）。这些模块可以像任何用户定义的样式表一样使用@use规则加载，它们的函数可以像任何其他模块成员一样调用。所有内置模块URL都以sass开头：表示它们是sass本身的一部分。常见函数简介，更多函数列表可看：https://sass-lang.com/documentation/modulesColor(颜色函数) sass包含很多操作颜色的函数。例如：lighten()与darken()函数可用于调亮或调暗颜色，opacify()函数使颜色透明度减少，transparent()函数使颜色透明度增加，mix()函数可用来混合两种颜色
在设计网页的时候常常遇到这种情况：一个元素使用的样式与另一个元素完全相同，但又添加了额外的样式。通常会在HTML中给元素定义两个class，一个通用样式，一个特殊样式。普通CSS的实现接下来以警告框为例进行讲，解4种类型类型说明info信息！请注意这个信息。success成功！很好地完成了提交。warning警告！请不要提交。danger错误！请进行一些更改。所有警告框的基本样式（风格、字体大小、内边距、边框等...），因为我们通常会定义一个通用alert样式，类似于这样的.alert{ padding:15px; margin-bottom:20px; border:1pxsolidt
在设计网页的时候常常遇到这种情况：一个元素使用的样式与另一个元素完全相同，但又添加了额外的样式。通常会在HTML中给元素定义两个class，一个通用样式，一个特殊样式。普通CSS的实现接下来以警告框为例进行讲，解4种类型类型说明info信息！请注意这个信息。success成功！很好地完成了提交。warning警告！请不要提交。danger错误！请进行一些更改。所有警告框的基本样式（风格、字体大小、内边距、边框等...），因为我们通常会定义一个通用alert样式，类似于这样的.alert{ padding:15px; margin-bottom:20px; border:1pxsolidt
混合指令（Mixin）用于定义可重复使用的样式，避免了使用无语意的class，比如.float-left。混合指令可以包含所有的CSS规则，绝大部分Sass规则，甚至通过参数功能引入变量，输出多样化的样式。 mixin是可以重用的一组CSS声明。mixin有助于减少重复代码，只需声明一次，就可在文件中引用。 可以看出，mixin类似变量，不同的是变量存储值，mixin存储一组css声明。mixin可以传入参数。定义与使用混合指令@mixin@mixinmixin-name([param1,[param2...]]){ /*css声明*/}例1：标准形式//定义页面一个区块基本的样式@m
混合指令（Mixin）用于定义可重复使用的样式，避免了使用无语意的class，比如.float-left。混合指令可以包含所有的CSS规则，绝大部分Sass规则，甚至通过参数功能引入变量，输出多样化的样式。 mixin是可以重用的一组CSS声明。mixin有助于减少重复代码，只需声明一次，就可在文件中引用。 可以看出，mixin类似变量，不同的是变量存储值，mixin存储一组css声明。mixin可以传入参数。定义与使用混合指令@mixin@mixinmixin-name([param1,[param2...]]){ /*css声明*/}例1：标准形式//定义页面一个区块基本的样式@m
输出格式说明Sass编译输出的CSS格式可以自定义。有4种输出格式：:nested–嵌套格式:expanded–展开格式:compact–紧凑格式:compressed–压缩格式默认格式是:nested。可以使用:style选项或使用style命令行参数设置输出格式。命令标准格式：sass--watch(scss文件):(要生成的目标css文件)--style(输出格式)例如：sass--watchindex.scss:index.css--stylecompressed不同格式输出接下来我们把如下的css经过不同格式的编译，看不同输出格式的区别：html{ font-size:12px;
VScode设置中文打开vscode，按快捷键“Ctrl+Shift+P”输入configurelanguage，回车选择安装其他语言（默认是英文的）选择简体中安装（荧光笔标注的地方）按提示重启右下角会有安装成功提示，会有重启(restart)提示按提示重启。下载LiveSass编译器源码地址：https://github.com/ritwickdey/vscode-live-sass-compiler/现在3.0.0版本已不再维护，建议下载更高版本源码地址：https://github.com/glenn2223/vscode-live-sass-compiler/编译配置也可以点这里切换到
