.message
color: white
.important
background-color: red
.message-important
@extend .message, .important
In the above code @extend
is used in one line to add multiple classes' code to .message-important
, however, it is possible to use one extend per line like this:
.message-important
@extend .message
@extend .important
Either one of these methods will generate the following CSS:
.message, .message-important {
color: white;
}
.important, .message-important {
background-color: red;
}