Improving CSS With .LESS | CodeGuru

Improving CSS With .LESS

Cascading Style Sheets, or CSS, is a syntax used to describe the look and feel of the elements in a web page. CSS allows a web developer to separate the document content – the HTML, text, and images – from the presentation of that content. Such separation makes the markup in a page easier to […]

Written By
CodeGuru Staff
CodeGuru Staff
Mar 3, 2010
2 minute read
CodeGuru content and product recommendations are editorially independent. We may make money when you click on links to our partners. Learn More

Cascading Style Sheets, or CSS, is a syntax used to describe the look and feel of the elements in a web page.
CSS allows a web developer to separate the document content – the HTML, text, and images – from the presentation of that content. Such separation makes the markup in a page
easier to read, understand, and update; it can result in reduced bandwidth as the style information can be specified in a separate file and cached by the browser; and makes
site-wide changes easier to apply. For a great example of the flexibility and power of CSS, check out CSS Zen Garden. This website
has a single page with fixed markup, but allows web developers from around the world to submit CSS rules to define alternate presentation information.

Unfortunately, certain aspects of CSS’s syntax leave a bit to be desired. Many style sheets include repeated styling information because CSS does not allow the use of variables.
Such repetition makes the resulting style sheet lengthier and harder to read; it results in more rules that need to be changed when the website is redesigned to use a new primary
color. Specifying inherited CSS rules, such as indicating that a elements (i.e., hyperlinks) in h1 elements should not be underlined, requires creating
a single selector name, like h1 a. Ideally, CSS would allow for nested rules, enabling you to define the a rules directly within the h1 rules.

.LESS is a free, open-source port of Ruby’s LESS library. LESS (and .LESS, by extension) is a parser
that allows web developers to create style sheets using new and improved language features, including variables, operations, mixins, and nested rules. Behind the scenes, .LESS
converts the enhanced CSS rules into standard CSS rules. This conversion can happen automatically and on-demand through the use of an HTTP Handler, or done manually as part of
the build process. Moreover, .LESS can be configured to automatically minify the resulting CSS, saving bandwidth and making the end user’s experience a snappier one.

This article shows ASP.NET Developers how to get started using .LESS in your ASP.NET websites. Read on to learn more!

CodeGuru Logo

CodeGuru covers topics related to Microsoft-related software development, mobile development, database management, and web application programming. In addition to tutorials and how-tos that teach programmers how to code in Microsoft-related languages and frameworks like C# and .Net, we also publish articles on software development tools, the latest in developer news, and advice for project managers. Cloud services such as Microsoft Azure and database options including SQL Server and MSSQL are also frequently covered.

Property of TechnologyAdvice. © 2026 TechnologyAdvice. All Rights Reserved

Advertiser Disclosure: Some of the products that appear on this site are from companies from which TechnologyAdvice receives compensation. This compensation may impact how and where products appear on this site including, for example, the order in which they appear. TechnologyAdvice does not include all companies or all types of products available in the marketplace.