Sass and Less: CSS preprocessors

Posted on Posted in Tech Corner

sass-and-lessAll of you know CSS, the Cascading Style Sheets, probably the most famous style sheet language used for describing the look and formatting of a document written in a markup language. If you want to make your css more modular and scalable you can use css preprocessors.

These tools work as any other preprocessors, php or asp ones, for example, taking code written in the preprocessed language and then converting that code into the same old css we’ve been writing for years. Two of the more popular css preprocessors are Sass and LESS.

Because they aren’t css, they aren’t bound by the limitations of css. The preprocessed language can give you more functionality than css as long as it eventually makes sure everything is output as css and works in a browser like we expect. Preprocessors allow css language to remain a simple language introducing at the same time the flexibility of variables. Preprocessors offer more than variables, they can offer whatever they want as long as the resulting css file they produce works as ordinary css.

The main issue of using preprocessors is that everyone working on the site needs to be using the same preprocessor. Part of your team couldn’t work in Sass while the some others use LESS and others still edit the css files directly.

If you want to know how preprocessors work you can click on the following snippets that will show you:

If you look through the code examples above you can see Sass and LESS aren’t hard to use!

[Credits |]

Leave a Reply

Your email address will not be published. Required fields are marked *