Archive for the ‘ELEMENTS’ category

Are you writing LESS CSS?

September 11th, 2012

If you are a web developer and you write a lot of CSS, which chances are you do, then you need to be writing it using LESS.  The website to download LESS is here: http://lesscss.org/ and using it is really simple,  just include it in your site like so:

<link rel="stylesheet/less" type="text/css" href="styles.less">
<script src="less.js" type="text/javascript"></script>

And the Less Compiler will do the rest for you.  When you have all of that in place, you can starting writing your LESS CSS.

Less Files have a .less extension and you just include them in the same directory that you have your css files in.  The beauty of using LESS is that you can mix it with standard CSS, it will recognize both, so you can refactor your CSS alongside the LESS syntax, it doesn’t care!!

You can read all about it over on the link I have provided but basically you can create Variables, Mixins, Nested Rules, and even have operations on things like color and height and widths, basically a simple programming language for CSS, pretty sweet huh?

If you need a starting point to get going with LESS, I recommend going over and downloading the ELEMENTS.less file here: http://lesselements.com/  It is basically a generified LESS file that takes a lot of the standard things you would do in LESS and puts them into a file to save you time.  I am also linking here my edited version of my elements file where I added a few more things if you would like something a little more robust:  https://github.com/eddie1459/elements