Posts

Showing posts with the label Tips for web developers

Difference between Less and CSS ?

Many of you may be familiar with the concepts of CSS. In CSS we can not write loops ,logic or many other programming constructs such if-else etc.Thus we can say css is a static language. On the other hand LESS or (SCSS) are CSS pre-processors. You can think of it as CSS with programming constructs, which help you in making your code modular and reusable. One possible use case is you can develop a theme system with LESS, its very easy by using variables for colors etc and changing the variable values to create a new theme for your webpage. Take a look at this example taken from Getting started | Less.js. @base: #f938ab; .box-shadow(@style, @c) when (iscolor(@c)) { -webkit-box-shadow: @style @c; box-shadow: @style @c; } .box-shadow(@style, @alpha: 50%) when (isnumber(@alpha)) { .box-shadow(@style, rgba(0, 0, 0, @alpha)); } .box { color: saturate(@base, 5%); border-color: lighten(@base, 30%); div { .box-shadow(0 0 5px, 30%) } } Compiles to .box { color...