Mixins allow creating a group of styles, which are reusable throughout your stylesheet without any need to recreation of non-semantic classes. In CSS, the mixins can store multiple values or parameters and call function; it helps to avoid writing repetitive codes. Mixin names can use underscores and hyphens interchangeably. Following are the directives present in Mixins −
|S. No.||Directive & Description|
|1||Defining a Mixin
@mixin directive is used to define the mixin.
|2||Including a Mixin
@include directive is used to include the mixins in the document.
The SassScript values can be taken as arguments in mixins, which is given when mixin is included and available as variable within the mixin.
|4||Passing Content Blocks to a Mixin
Block of styles are passed to the mixin.