• Home
  • Sass what is different between @include and @extend

Sass what is different between @include and @extend

August 4, 2016 Ning 0 Comments

For my understanding, extend not allowed customization, and include allowed.

@extend

%button
  background-color: lightgrey
  &:hover, &:active
    background-color: white

a
  @extend %button

button
  @extend %button

@include

@mixin my-button($size: 15, $color: red) {
  @include inline-block;
  @include border-radius(5px);
  font-size: $size + px;
  background-color: $color;
}
%button {
  @include my-button;
}
%alt-button {
  @include my-button(15, green);
}
%big-button {
  @include my-button(25);
}

leave a comment

*