css中mixin的用法 ，@mixin是一种简化代码的方法，类似于存了一个变量

@mixin，能够提高代码的重复使用率。mixin定义（使用@mixin定义一个类似的方法）：

@mixin demo-box($width, $factor, $radius){
  width: ($width + $radius) * $factor;
  height: ($width + $radius) * $factor;
  display: flex;
  align-items: center;
  justify-content: center;
}

mixin使用（使用@include引用）

.demo-1 {
    @include demo-box(90px, 1, 10px);
}

编译后形成的css：应该就这样

.demo-1 {
    width: (90px + 10px) * 1;
    height: (90px + 10px) * 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

• css中的mixin，其实是less，sass这类css预处理语言中的混合，自定义了一段代码，后面可以用@include调用。自定义 传递参数这个特性使得它们非常灵活，强大。