The Joy of Bootstrap-- Build awesome web pages the easy way

The Bootstrap Grid System is the key to creating pages that resize automatically for different sized devices.

Glyphicons are icons you can use to make your page look more interesting. Glyphicons are built into Bootstrap and very easy to use.

Bootstrap offers several classes that can make your tables look awesome.

Bootstrap enhances typography automatically and also offers many other cool tricks for formatting quotes, adding contextual cues and much more.

In this module we cover how to hide or show elements based on the size of the screen.

This module explains what a drop-down menu is and how the native Bootstrap nav bars work. Several additional examples were added after the video was filmed.

Bootstrap offers several variations of buttons and button groups. In this module we explore how to use buttons in your application.

Bootstrap allows you to group multiple elements into a single 'input group'. The best real-life example I've seen of this is the search bar on Amazon where (in a single control) you can select the department to search (.i.e, books), enter a search term, and click the search button. In this module you'll learn exactly how to build such a control on your own site.

Bootstrap offers several easy controls you can use to indicate that a page or article spans multiple pages.

Badges are those little numeric indicators you see next to hot links. You'll know what I mean when you see one.

Jumbotrons are like billboards for your website, and Carousels are like animated billboards. In this module I show you how to make both using Bootstrap.

Page Headers are a very simple control used to organize content on a page.

Bootstrap makes it extremely easy to make images responsive to different device sizes. It also lets you create thumbnails and even crop images into circles, squares, and ovals.

Progress bars let you communicate how far along a user is in a process, how a procedure is progressing, or any other situation where you want to communicate a percentage.

(One student noted that the sr-only class means that the text within the span will only be read by a screen reader). In the lecture I admit I don't know what sr-only means.

A media object in Bootstrap is not a video or audio file. Rather, the Bootstrap media object is a way of grouping images and text together.

List Groups are an element with a box around it, or a group of elements, with each element in a box.

To help make certain content stand out on a page you can put it inside a panel or a well. A panel is a box with lines and padding that can also have a header or a footer. A well is a box with lines designed to make it look as if it is inset into the page.

Any Bootstrap component that involves any kind of motion or animation requires a reference to the bootstrap.js file and typically involves some jQuery scripting too.

Tabs allow you to put a lot of information on the screen without overwhelming the user.

Tooltips and Popovers allow you to provide 'extra' content when users need it and keep it out of the way when they do not.

Thank you for completing this course! If you liked it, I would appreciate a rating.