# sass
```
author:shangyy
date:2018-02-05
```
[offical website](http://sass-lang.com/)
[cn website](https://www.sass.hk/)
### 一、sass basic
### 1.variables
```css
$blue : #1875e7;
div {
color : $blue;
}
```
### 2.nesting
```css
nav {
ul {
margin: 0;
padding: 0;
list-style: none;
}
}
```
### 3.import
```css
@import 'reset';
```
### 4.mixins
```css
@mixin border-radius($radius) {
-webkit-border-radius: $radius;
-moz-border-radius: $radius;
-ms-border-radius: $radius;
border-radius: $radius;
}
.box { @include border-radius(10px); }
```
### 5.extend
```css
.class1 {
border: 1px solid #ddd;
}
class2要继承class1，就要使用@extend命令：
.class2 {
@extend .class1;
font-size:120%;
}
```
6.Operators
```css
.container{
300px / 960px * 100%;
}
```