Inheritance in LESS

Less 1.4 adds inheritance in the form of @extend. Similar to a @mixin
but more efficient in its output. A mixin will produce the same chunk
of code everytime its used but extend groups your selectors
together.

.btn {
    color: red;
    background: green;
    border: 1px solid red;

    span {
        background: url('smile.png') no-repeat;
    }
}


.go-btn {
    &:extend(.btn);

    color: green;
}

compiles to:

.btn,
.go-btn {
    color: red;
    background: green;
    border: 1px solid red;
}
.btn span {
    background: url('smile.png') no-repeat;
}
.go-btn {
    color: green;
}

Passing in all extends nested elements

.btn {
    color: red;
    background: green;
    border: 1px solid red;

    span {
        background: url('smile.png') no-repeat;
    }
}

.go-btn {
    &:extend(.btn all);

    color: green;
}

Compiles to:

.btn,
.go-btn {
    color: red;
    background: green;
    border: 1px solid red;
}
.btn span,
.go-btn span {
    background: url('smile.png') no-repeat;
}
.go-btn {
    color: green;
}