开发者

Delete / remove an attribute from a mixin

开发者 https://www.devze.com 2023-04-07 11:59 出处:网络
The following .scss code: @mixin div-base { width: 100p开发者_如何学JAVAx; color: red; } #data { @include div-base;

The following .scss code:

@mixin div-base {
  width: 100p开发者_如何学JAVAx;
  color: red;
}

#data {
  @include div-base;
}

will produce:

#data {
  width: 100px;
  color: red; }

I would like to do something like:

#data {
  @include div-base;
  remove or delete: width right here
}

to produce:

#data {
  color: red;
}

Is it even possible to do something along these lines?


The best way to do this is using arguments on your mixin:

@mixin div-base($width: 100px, $color: red) {
  @if $width != false { width: $width; }
  @if $color != false { color: $color; }
}

#data {
  @include div-base($color: false);
}


You can achieve the same effect by setting back the width to the default value (set it to auto):

@mixin div-base {
  width: 100px;
  color: red;
}

#data {
  @include div-base;
  width: auto;
}
0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号