What is sass extend

You can use remaining property in your new class, inheritance class property in the new class.

If you will extend word inside of any classes. As given examples in below:

.btn {

  color: #fff;

  font-size: 15px;

  font-weight: bold;

}

.padding{ padding:15px;}

.btnSuccess {

  @extend .btn;

  @extend .padding;

  background-color: green;

}

.btnWarning {

  @extend .btn;

  background-color: orange;

}

Compiled code:

.btn, .btnSuccess, .btnWarning {

  color: #fff;

  font-size: 15px;

  font-weight: bold; }

.padding, .box, .btnSuccess {

  padding: 15px; }

.btnSuccess {

  background-color: green; }

.btnWarning {

  background-color: orange; }