- By Shiv Prasad Koirala in .Net
- Aug 11th, 2014
English meaning of LESS means minimizing something. LESS.JS simplifies your CSS by adding extra capabilities to CSS like variables, mixin's etc. LESS.JS makes your CSS dynamic. LESS extends your CSS and simplifies your CSS.
For example below is a simple CSS which has two styles "style1" and "style2". If you notice the below CSS the background color is duplicated. If we ever want to change this we have to change in multiple places.
But if use "LESS.JS" we can create a variable which has color stored and set the CSS property using the variable. If we ever want to change the color we just need to change the variable value.
Below is a simple LESS enabled CSS where we have created a variable "mybackgroundcolor" which is set at the top and that variable is then used to set the background color property in the CSS. This makes our CSS dynamic and easy to maintain.
Before running the above code ensure that you have link to less.js file at the top. You can get less JS file from lesscss.org.
Below is a video created by questpond.com team which explain LESS practically.
If you are looking to get trained on MVC , JSON , Angular , Less click here.
Shiv Prasad Koirala
Visit us @ www.questpond.com or call us at 022-66752917... read more