SCSS笔记

SASS是成熟，稳定，强大的 CSS预处理器 ，而 SCSS 是SASS3版本当中引入的新语法特性，完全兼容CSS3的同时继承了CSS强大的动态功能。

CSS书写代码规模较大的web应用时，容易造成选择器，层叠的复杂度过高，因此推荐通过SASS预处理器进行CSS的开发，SASS提供的变量，嵌套，混合，继承等特性，让CSS的书写更加有趣和程式化。

1.变量

SASS中可以定义变量，用来存储需要在CSS中复用的信息，方便统一修改和维护。

sass代码：

$blue:#1875e7;
div {
  color : $blue;
}

 对应生成的css代码：

div {
    color : #1875e7;  
}

 如果变量需要镶嵌在字符串中，就必须写在  #{}  中：

$side : left;
.rounded{
    border-#{$side}-radius : 5px;  
}

2.嵌套

 

转载于:https://www.cnblogs.com/edward-life/p/11059828.html