background preloader

LESS

Facebook Twitter

Modernizr: the feature detection library for HTML5/CSS3. LESS.app For Mac OS X. Where Can I Learn More? Less.app is powered by Less.js. The best place to discover the full power of {Less} is the official website: lesscss.org. There are also some great tutorials floating around: Before you send me a bug report, make sure you've read the offical docs carefully. Also, be sure to check out the alternate dock icon by Dmitry Fadeyev (the guy who created the original icon and {Less} website.) Other Frequently Asked Questions I thought LESS.js compiles in the browser?

It does. So, this doesn't use Ruby anymore? Correct. Do I need to install LESS.js or include it in my HTML? Nope. Does it support Growl? Yes. Why is it Intel only? Because the app uses Google's V8 javascript engine (the same one inside Chrome) to run Less.js. What if my LESS file has errors? You'll see the error message from the compiler in the app window (or growl note). Why do I have to add folders and not individual files? First, you can add files if you want; we'll just grab the folder they're in. Springsteen. LESS « The Dynamic Stylesheet language. Get Into LESS: the Programmable Stylesheet Language. I don't like CSS. Plain and simple. It makes the World go round on the web, yet the language is restrictive and hard to manage. It's time to spruce up the language and make it more helpful by using dynamic CSS with the help of LESS.

Let me illustrate my point with an example right away. Instead of using #FF9F94 to get a dark peach color, wouldn't it be easier to store that color value inside a variable and just use that variable? If you want to recolor your webpage you just change the value of the variable in one place and that's that. In other words: it would be awfully nice if we could use some programming and logic inside CSS to make it a more powerful tool.

What Is LESS? LESS is a superset of CSS. LESS adds much needed dynamic properties to CSS. How To Use LESS There are two ways to use LESS. Using The LESS Javascript File First of all head down to the LESS website and grab the Javascript file. Next, create a file with the .less extension and link it to your page with the code below: SimpLESS - Your LESS CSS Compiler. Erstellen von „LESS (Stylesheet-Sprache)“ LESS (stylesheet language) During translation, the values of the variables are inserted into the output CSS document.[4] The code above in LESS would compile to the following CSS code. The above code in LESS would compile to the following CSS code: LESS has a special type of ruleset called parametric mixins which can be mixed in like classes, but accepts parameters. CSS supports logical nesting, but the code blocks themselves are not nested.

LESS allows nesting of selectors inside other selectors. LESS allows operations and functions. As of LESS 1.4, LESS supports nested, inherited rules via the &:extends and @extends pseudo-selector. LESS is inspired by Sass.[6] Sass was designed to both simplify and extend CSS, so things like curly braces were removed from the syntax. The newer versions of Sass also introduced a CSS-like syntax called SCSS (Sassy CSS).[2] For more syntax comparisons, see LESS can be applied to sites in a number of ways.