The mixins are formats that have been defined as a class and can be applied to another class by using parameters. Below we can see an example:
.rounded-corners (@radius: 10px) {
border-radius: @radius;
-webkit-border-radius: @radius;
-moz-border-radius: @radius;
}
#header {
.rounded-corners;
}
#footer {
.rounded-corners(15px);
}
The result of the above code after the compilation is the following:
#header {
border-radius: 10px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
}
#footer {
border-radius: 15px;
-webkit-border-radius: 15px;
-moz-border-radius: 15px;
}