Over a million developers have joined DZone.
{{announcement.body}}
{{announcement.title}}

LESS is More: The Dynamic Stylesheet Language

DZone's Guide to

LESS is More: The Dynamic Stylesheet Language

· Web Dev Zone
Free Resource

Discover how to focus on operators for Reactive Programming and how they are essential to react to data in your application.  Brought to you in partnership with Wakanda

Woow!!! That is the word that best defines Less.

From time to time someone creates something really useful with a touch of magic. John Resig creates jQuery, not the only one neither the first one, but it is the most famous JavaScript library.


Now, Alexis Sellier (alias cloudhead) has created the amazing Less tool which can be defined as “The dynamic stylesheet language”.

LESS extends CSS with dynamic behavior such as variables, mixins, operations and functions


A brief sample

Imagine a web project with many lines of CSS defining your nice styles about buttons, borders, backgrounds, etc. Image you have a nice #aaaaaa color shared among many elements (borders, text color, …). What happends if you decide to change that color? you need to rewrite the color code on every place you put it.

The magic of Less allows you to define a color variable and use it around. Later if you decide to change the color, simply change the variable value.

How it works?

Instead create CSS files you need to create LESS files, they are similar to CSS bit more “powerful” (you can use variables, functions, …).

Less library is responsible to read the LESS file and create a CSS file for you.

How to use

You can use LessCSS in different ways. Developing it is best to use the “dynamic” way, that is, include the Less JavaScript code in your page a LESS file and let Less code to create and “inject” the generated CSS in your page.

In a production environment, once set the LESS file, it is better to compile it to a CSS and include this last.

 

Source: http://acuriousanimal.com/blog/2011/08/29/a-word-about-less/

Learn how divergent branches can appear in your repository and how to better understand why they are called “branches".  Brought to you in partnership with Wakanda

Topics:

Opinions expressed by DZone contributors are their own.

THE DZONE NEWSLETTER

Dev Resources & Solutions Straight to Your Inbox

Thanks for subscribing!

Awesome! Check your inbox to verify your email so you can start receiving the latest in tech news and resources.

X

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}