stss 入门 (stss quick start)

refer to:  http://sass-lang.com/guide

scss  是在 sass的第三个版本出现的主要语法. 已经取代了 sass.   stss 是 scss的 super set. 所以,可以认为 stss 基本等于 scss. 

stss 的代码量 是 tss 的 80%. 

基本规则:

1. 每行以 ; 结束.  

2. 定义的 .class, #id 前后不需要双引号 ""

3. 属性的值 不需要双引号. 

4. 可以定义变量. 

例子: 

$red: red;
$green: green;

.message {
  border: 1px solid #ccc;
  padding: 10px;
  color: $red;
}

.success {
  @extend .message;
  border-color: $green;
}

会编译成:

".message": {
  border: "1px solid #ccc",
  padding: "10px",
  color: "red"
},
".success": {
  border: "1px solid #ccc",
  padding: "10px",
  color: "red"
},
".success": {
  borderColor: "green"   
}