scss里的Mixins用法介绍

115 阅读1分钟

请添加图片描述

www.creativebloq.com/web-design/…

@mixin border-radius($radius) {
  -webkit-border-radius: $radius;
     -moz-border-radius: $radius;
      -ms-border-radius: $radius;
          border-radius: $radius;
}

.box { @include border-radius(10px); }

生成的css:

.box {
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  border-radius: 10px;
}

在scss里扮演的角色有点像编程语言里的函数。

请添加图片描述