Sass 简介

Sass stands for Syntactically Awesome Stylesheets Sass, and was created by Hampton Catlin. It's a way to simplify your CSS workflow, making development and maintenance tasks easier. Sass是一个能够CSS预编译的工具，能够提升开发效率。

Sass 语法

1. 变量 变量通过$+变量名来定义

   $font-color:yellow;
   body{
   font-color:$font-color;
   }
   

   编译后

   body{
   font-color:yellow;
   }
   

2. 嵌套

    nav{
        font-size:16px;
        ul{
        font-size:14px;
        {
    }
   

   编译后

    ```
    nav {font-size:16px;}
    nav ul{ font-size:14px;}
    ```
   

3. Sass部件 如果以下划线_开头的scss文件，会被认为是sass的一部分，不会编译成.css文件。和import一起用。

    ![这里写图片描述](http://img.blog.csdn.net/20160504152438775)
   

4. import

   import的时候不用加.scss后缀sass可以自动识别。

5. Mixins

   函数定义方式:@mixin + 函数名称+ 参数，可以传入参数，通过@include来调用并传入参数。 编译后：

6. Extends/Inheritance

   通过@extend关键字来继承一些公有属性。 编译后：

7. Operators 操作符

   包括加减乘除和%.

   编译后：