浅谈sass
sass:css预处理器
sass语法
1.定义变量
$变量名:值
2.变量拼接
如果变量需要拼接则需要 #{变量}
3.嵌套
&代表父级
4.混合宏 用来做兼容处理
-webkit-
-o-
-ms-
-moz-
@mixin 混合宏名称
@include 调用混合宏
5.继承
@extend
6.引入公共样式
@import
公共文件的取名方式 _名称.scss
引入的时候是不需要加_
7.注释
多行注释 在css中可显示的
/*!
*/
单行注释 不在css中显示 只在scss中显示 //
/*
多行注释 不在css中显示
*/
8.循环中
to 是到最后的值减1
through 写多少就是多少
9.判断
@if() {} @else{}
10.函数
@function 函数名(){
@return
}
混合宏与函数的区别
1.混合宏是没有返回值的,不能用return,是用来做兼容处理的
2.函数是一个方法,是有返回值的,可以使用return,只能返回出去一个值
共同的特点:重复利用