8. What is the use of Nesting in LESS?
Answer:
In LESS, Nesting is used to make your code follow some visual hierarchy.
Nesting makes your code, simple, clean and less complex.
It is very important to be careful while nesting because overly nested rules may cause difficult to maintain.
9. What do you know about Parametric Mixins?
Answer:
Parametric mixin is a special type of mixin in which one or more parameters are used to extend functionality of LESS by taking arguments and its properties to customize the mixin output when mixed into another block.
For example,
.border(@width; @style; @color)
{
border: @width @style @color;
}
.myheader
{
.border(5px; dashed; red);
}
In the above example, the parametric mixin is border which has three parameters: width, style and color. These parameters are used to customize the mixin output according to passed parameter values.
10. What is the use of Mixins in LESS?
Answer:
Mixin is a collection of CSS properties which facilitates you to add a bunch of properties from one rule-set into another rule-set and includes class names as its properties.
These are similar to functions in programming languages. In Less, mixins can be declared in the same way as CSS style using class or id selector.
It can store multiple values and can be reused in the code whenever necessary.
Mixin Syntax:
.round-borders
{
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
}
#menu
{
color: gray;
.round-borders;
}
Mixins allow for more efficient and clean code repetitions, as well as easier alteration of code.
11. What is the use of merge function in LESS?
Answer:
Less Merge combines the values of multiple properties in a list separated by a comma or space under a single property. It is used to deal the properties such as transform and background.
There are two types of functions supported by the Merge,
1. Comma : It adds property value at the end.
2. Space: It adds property value with space.
12. What do you know about loop structures in LESS?
Answer:
Loop allows us to execute a statement or group of statements multiple times. Various iterative/loop structures can be created when recursive mixin combine with Guard Expressions and Pattern Matching.
13. What is the use of e() function?
Answer:
Using e() function you can escape a value, so that it passes straight through to the compiled CSS, without being noticed by the LESS compiler.
14. List the types of Misc function in LESS?
Answer:
| Function name | Description |
|---|
| color | It is a string that is used to represent colors. |
| image-size | It is used to check the dimension of the image from the file. |
| image-width | It is used to check the width of the image from the file. |
| image-height | It is used to check the height of the image from the file. |
| convert | It is used to convert a number from one unit to another. |
| data-uri | It specifies Uniform Resource Identifier (URI) schema, which inlines a resource in web pages. |
| default | It returns true only when it is available inside the guard condition and does not match with any other mixin. |
| unit | It returns true only when it is available inside the guard condition and does not match with any other mixin. |
| get-unit | It returns its unit where the argument is present with number and units. |
| svg-gradient | It is a transition of one color to another. It can add many colors to the same element. |
