一、mixin是什么？
@mixin是一种简化代码的方法，能够提高代码的重复使用率。Mixins允许我们在项目中复用样式片段，可以传递参数这个特性使得它们非常灵活，强大。
二、mixin的用法
mixin定义（使用@mixin定义）：
@mixin hexagon-generator($hexagon-width, $factor, $border-radius){
display: inline-block;
border-radius: 50
width: ($hexagon-width + $border-radius) * $factor;
height: ($hexagon-width + $border-radius) * $factor;
display: flex;
align-items: center;
justify-content: center;
}mixin使用（使用@include引用）：
.hexagon-shape {
@include hexagon-generator(88rpx, 1, 8rpx);
}编译后的css：
.hexagon-shape {
display: inline-block;
border-radius: 50
width: (88rpx + 8rpx) * 1;
height: (88rpx + 8rpx) * 1;
display: flex;
align-items: center;
justify-content: center;
}css中的mixin，其实是less，sass这类css预处理语言中的混合，可以理解成自定义了一段代码，后面可以用@include调用。
以上就是css中mixin是什么？的详细内容，更多请关注易知道|edz.cc其它相关文章！
