CODEWITHSUNDEEP
cssless
Anais Richmond
Anais Richmond

Reputation: 67

how to use less with bootstrap?

there are 3 files, less.js, style.less and style.css. I so far don't understand what the less.js do. Do I need to include it in somewhere? and for style.less, I know I should write less in it and it compile to my style.css, but should I included it in my index.html?

I don't understand the guide in less.org.

Upvotes: 0

Views: 645

Answers (1)

James A Mohler
James A Mohler

Reputation: 11120

First off you don't need to use less in order to use Twitter Bootstrap. The idea behind less to have smaller style sheet files. And Being that Bootstraps css is so large, less helps mitigate that issue. Now about the files you mentioned.

Browsers don't understand *.less files. less.js, in this context, serves as the "compiler" for the *.less files

Start from the website:

Link your .less stylesheets with the rel set to “stylesheet/less”:

<link rel="stylesheet/less" type="text/css" href="styles.less" />

Then download less.js from the top of the page, and include it in the element of your page, like so:

 <script src="less.js" type="text/javascript"></script>

End from the website

They mention compiling the *.less into a proper css. What they should have elaborated somewhere on the site is "Why compile less?"

  • Like all code, less will require debugging
  • Running it through a command line compiler can find errors that less.js can't
  • less.js is an additional file and processing load that is put on the browser. Hence compiling *.less into *.css can make for a faster browsing experience

The Bootstrap gives you the option of choosing either css or less

Upvotes: 2

Related Questions