| 31 | Using @extend as a Mixin Alternative |
In Task 8, Keeping Code Clean with Mixins, you learned about mixins—ways to apply one set of styles to another area of your code. There’s another way to achieve a similar outcome, and that’s by using @extend.
The @extend function extends any styles from a previous selector onto a new selector. So, say you had a .button class. You may want to copy those styles over to a different type of button. Just use @extend .button; in the new class and it works!
You might be wondering why you would use the @extend> function rather than a mixin. Don’t they just do the same thing? Well, not really. You’ll discover more of the differences in Task 33, Understanding the Dangers of @extend, but for now, here’s the ...
Get Pragmatic Guide to Sass 3 now with the O’Reilly learning platform.
O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.
