Want to save time on development? Want to learn the basics of a great foundation? In this article, I’ll briefly introduce you to Bootstrap and provide you with additional resources so you can learn more about it.
Check out our new Ultimate Guide To Bootstrap Resources
Bootstrap was initially developed by Twitter engineers, and here’s how they describe/define it:
Bootstrap is a front-end toolkit for rapidly developing web applications. It is a collection of CSS and HTML conventions. It uses some of the latest browser techniques to provide you with stylish typography, forms, buttons, tables, grids, navigation and everything else you need in a super tiny (only 6k with gzip) resource.
bootstrap.js. (Note that Bootstrap plugins require jQuery.)
Getting More with LESS
The LESS files are part of what makes Bootstrap so powerful. It adds additional dynamic functionality to the CSS with variables, mixins, operations and functions. To find out more about LESS, visit www.lesscss.org or the LESS Github page.
You can play around and modify almost anything in Bootstrap, but you’ll want to avoid altering the core files that are shown in the first screenshot.
Bootstrap is entirely customizable but you have to be careful when customizing. You will want to keep whatever Bootstrap stylesheet you’re working with separate and intact and then create a new stylesheet for your own customized elements. Keeping Bootstrap’s files separate will make upgrading less of a headache.
All that being said, not all web projects will require all the files Bootstrap has to offer, so visit this handy Customizer Tool so you can choose and download which elements you need for your project. This gives you quick access to your own custom version of Bootstrap.
With the release of the latest version of Bootstrap (Bootstrap 3), all files are now coded to allow for responsive design and meant to work with mobile devices and tablets.
Because Bootstrap is a responsive framework, as a designer/developer you must use the HTML5 doctype when coding, and remember to make your images responsive-friendly by adding the
.img-responsive bootstrap class.
Bootstrap is a trusted and thoroughly tested framework used by developers everywhere. If you are ready to start working with Bootstrap, be sure to read the documentation thoroughly and the
getting-started.html file. Also check out our Ultimate Guide to Bootstrap: Bootstrap templates, themes and editors.
To keep up with Bootstrap news, developments and updates, visit the Bootstrap blog regularly.
If you want to find out more about how Bootstrap was developed and the reason why Twitter uses it, check out this blog post from 2011 announcing its release.
If you need more Bootstrap themes, visit: