SASS Mixins and Functions 1 — Questions and Answers
Question 1: How do you define a mixin in Sass?
- @mixin name { } (Correct answer)
- @define name { }
- @include name { }
- @create name { }
Correct answer: @mixin name { }
Mixins are defined using the `@mixin` directive followed by the mixin name and a block of styles.
Question 2: How do you include a mixin in Sass?
- @include mixin-name; (Correct answer)
- @use mixin-name;
- @apply mixin-name;
- @call mixin-name;
Correct answer: @include mixin-name;
The `@include` directive is used to apply a mixin's styles to a selector.
Question 3: How do you pass arguments to a Sass mixin?
- @include mixin-name($arg1, $arg2); (Correct answer)
- @include mixin-name[arg1, arg2];
- @include mixin-name{arg1, arg2};
- @include mixin-name arg1 arg2;
Correct answer: @include mixin-name($arg1, $arg2);
Arguments are passed to mixins inside parentheses when calling `@include`.
Question 4: What is the difference between a Sass mixin and a function?
- Mixins output CSS rules; functions return a single value (Correct answer)
- Functions output CSS rules; mixins return values
- They are identical
- Mixins can only take one argument
Correct answer: Mixins output CSS rules; functions return a single value
Sass mixins generate CSS declarations, while functions use `@return` to produce a single computed value.
Question 5: How do you define a Sass function?
- @function name($args) { @return value; } (Correct answer)
- @mixin name($args) { @return value; }
- @define function name($args) { }
- @func name($args) { }
Correct answer: @function name($args) { @return value; }
Custom functions are defined with `@function`, accept arguments, and must use `@return` to produce a value.
Question 6: Which Sass feature allows a mixin to accept a variable number of arguments?
- Variadic arguments using `$args...` (Correct answer)
- Default arguments
- Keyword arguments
- Named lists
Correct answer: Variadic arguments using `$args...`
Appending `...` to the last parameter (`$args...`) allows a mixin or function to accept any number of arguments.
How do you define a mixin in Sass?