less : Interview Questions

Answer:

LESS is dynamic style sheet producing language. LESS is a CSS pre-processors and extends CSS with dynamic behaviour. It allows for variables, mixins, operations and functions. LESS runs on server side and client side both.

Answer:

Creating or storing LESS file is similar to creating/storing CSS file. A new LESS file can be created with a .less extension, or you can rename existing .css file to .less file. You can write LESS code with existing CSS code.

The best way of creating it inside ~/content/ or ~/Styles/ folder

Answer:

  • Via npm LESS can be used on the command line
  • Download as a script file for the browser
  • For third party tools, it is used

Answer:

LESS allows variables to be defined. In LESS, the variable is represented as @sing. While, variable assignment is done with a: (colon) sing. The values of the variables are inserted into the CSS output file as well as minified file.

Answer:

Mixins enable embedding all the properties of a class into another class by including the class name as one of its properties. It is just like variables but for whole classes.

Answer:

  • hue
  • saturation
  • hsvhue
  • saturation
  • hswalue
  • red
  • green
  • blue
  • alpha
  • luma
  • luminance

Answer:

In CSS, Data URI’s is one of the best technique, it allows developers to avoid external image referencing and instead embed them directly into a stylesheet. Data URIs are the excellent way to reduce HTTP requests

Answer:

The “ Source Map Less Inline” option indicates that we should include all of the CSS files into the sourcemap. Which means that you only need your map file to get to your original source

Answer:

When you specify all keyword last in an extend argument, it tells LESS to match that selector as part of another selector.

Answer:

The strictImports controls whether the compiler will allow a @import inside of either @media blocks or other selector blocks

Answer:

Each style-sheet language is good in their perspective and use; however there are few differences in their usage.

LESS SASS
LESS uses JavaScript and processed at client-side Sass is coded in Ruby and thus processed to server-side
Variable names are prefaced with the @symbol Variable name are prefaced with $ symbol
LESS does not inherit multiple selectors with one set of properties Sass inherits multiple selectors with one set of properties
LESS does not work with “unknown” units neither it returns syntax error notification for incompatible units or maths related syntax error Sass allows you to work with “unknown” units also returns a syntax error notification for incompatible units
 

Answer:

&combinator concatenates nested selector with the parent selector. It is useful for Pseudo classes such as :hover and :focus

Answer:

Operations can be used for performing functions like

  • Simple Mathematical operators: +, – , *, /
  • Color functions
  • Math functions
  • Any size or colour variable can be operated upon