scss在项目中使用方便，简洁~
1.定义变量
$color:red;.box{ ???????background-color:$color; ???????}2.嵌套css
#content{ ???div{ ???????aside{ ???????????background-color: red; ???????} ???????h1{ ???????????color: green; ???????} ???}}3.父选择器标识符
#content{ ???div{ ???????aside{ ???????????background-color: red; ???????} ???????a{ ???????????color: red; ???????????&:hover{ ???????????????color: blue; ???????????} ???????} ???}}4.嵌套属性
nav{ ???border{ ???????width:1px; ???????style:solid; ???????color:red; ???}}5.混合
先定义要混合的样式：@mixin
@mixin corners{ ???-moz-border-radius:2px; ???-webkit-border-radius:2px; ???border-radius:2px;}使用：@include
div{ ???width: 200px; ???height: 100px; ???@include corners;}6.继承
.error { ?border: 1px solid red; ?background-color: #fdd;}.seriousError { ?@extend .error; ?border-width: 3px;}7.函数的使用
$fontSize:37.5;@function px3rem($px){ ??????@return ?($px/$fontSize) +rem ;}8.控制指令
if
p { ?@if 1 + 1 == 2 { border: 1px solid; } ?@if 5 < 3 { border: 2px dotted; } ?@if null ?{ border: 3px double; }}for
@for $i from 1 through 3 { ?.item-#{$i} { width: 2em * $i; }}9.导入文件
@import ‘reset‘;
10.注释
body { ?color: #333; // 这种注释内容不会出现在生成的css文件中 ?padding: 0; /* 这种注释内容会出现在生成的css文件中 */}以上为sass的基础语法，详细内容请参考https://www.sass.hk/网站。
scss 语法
原文地址：https://www.cnblogs.com/amy2017/p/10075951.html