Bootstrap Introduction


This entry is part 1 of 4 in the series Bootstrap

Here is what Wikipedia says about Bootstrap: “Bootstrap is a free and open-source front-end web framework for designing websites and web applications. It contains HTML- and CSS-based design templates for typography, forms, buttons, navigation and other interface components, as well as optional JavaScript extensions. Unlike many web frameworks, it concerns itself with front-end development only.” Wikipedia then goes on to mention: “Bootstrap is the second most-starred project on GitHub, with more than 100,000 stars and 45,000 forks.”

Bootstrap, originally named Twitter Blueprint, was developed by Mark Otto and Jacob Thornton at Twitter as a framework to encourage consistency across internal tools.

Learning Bootstrap

Check out a YouTube video on Boostrap called Bootstrap Tutorial by Derek Banas. He is using version 3.3.5 in the video, but mentions version 4. The code for the video can be found on his website. I have another post at this website that shows some of the code from the video. You can copy that code into an html file of your own and then open that file with a browser to see the results. This site’s post is called Bootstrap Introduction Video Tutorial.

A good source of information on Boostrap is at w3schools.com where they have a Bootstrap tutorial. They also have a class reference, among many other things.

You can download a Bootstrap Cheatsheet in pdf format from Cheatography.

Bootstrap 4

Bootstrap 4 stable version released on 18th Jan 2018, is a major rewrite from Bootstrap 3. Wikipedia lists the changes to Bootstap in Bootstrap version 4 as follows:

  • Switched from Less to Sass.
  • Launched reboot in place of normalize css.
  • Dropped IE8, IE9, and iOS 6 support.(IE = Internet Explorer)
  • Added flexbox support and then dropped non-flexbox support.
  • Added navigation customization options.
  • Added responsive spacing and sizing utilities.
  • Switched from pixels to root ems.
  • Increased global font-size from 14px to 16px.
  • Dropped the panel, thumbnail, and well components in favor of cards.
  • Dropped the Glyphicons icon font.
  • Dropped the pager component.
  • Added huge number of utility classes.
  • Improvised form styling.
  • Improvised buttons and dropdowns.
  • Improvised media objects and image classes.
  • Rewrote almost all components, jQuery plugins and documentation.
Series NavigationBootstrap Glyphicon Components >>