Mixins in SASS
In this lesson we'll learn about mixins, which allows you to include one class inside another. Let's see what it is and how to work with it.
Essentially, mixing is the use of some classes inside others, when one class is a blank - a certain piece of code that we can use in many places.
What is convenient about this? In pure CSS we would have to type a code template everywhere where it is needed, but in SASS you can write it in one place and then connect it to the necessary places in the code.
To declare mixins, use the @mixin directive, after which we specify its name, parameters, and a block with a body:
@mixin mix {
width: 100px;
height: 100px;
}
