Customizing Bootstrap CSS template

Question

I am just getting started with Bootstrap from Twitter and am wondering what the ‘best practices’ is for customization. I want to develop a system that will take advantage of

Answer 1

I think the officially preferred way is now to use Less, and either dynamically override the bootstrap.css (using less.js), or recompile bootstrap.css (using Node or the Less compiler).

From the Bootstrap docs, here's how to override bootstrap.css styles dynamically:

Download the latest Less.js and include the path to it (and Bootstrap) in the .

To recompile the .less files, just save them and reload your page. Less.js compiles them and stores them in local storage.

Or if you prefer to statically compile a new bootstrap.css with your custom styles (for production environments):

Install the LESS command line tool via Node and run the following command:

$ lessc ./less/bootstrap.less > bootstrap.css