这里既然是对语法的介绍,那么至于如何安装和编译scss我就不多少了,主要是因为本人在群里认识的小伙伴有的不会用scss,所以就借着放假的机会来对scss语法做个总结,博主在开发过程中用scss蛮多,所以对scss语法还是熟知的。

1.自定义变量

$color:pink;
.test1{
    background-color:$color;
}

通过编译工具编译出来后

.test1{    background-color:pink;
}

注:时间原因我在这里只写scss了,就不写编译后的结果,一来方便大家自己去尝试编译,二来增加大家对scss的理解:编译工具kaola很好的一个编译工具,大家可以百度如何使用,再这里就不做过多介绍了。
***
2.插入一个变量

$right:right;
.test2{
    border-#{$right}:1px solid #000;
}

网友评论