Bootstrap Development

Bootstrap provides an extremely powerful set of HTML and CSS templates that makes it almost trivial to create fluid and adaptive Web user interfaces that look great on any device. Bootstrap also promotes cross-browser compatibility, so you can focus on the UI and leave Bootstrap worry about browser nuances.

Duration: 2 days

Who is it for: This course is for developers who need to be able to use Bootstrap to create web user interfaces.

Layout: This course is a mixture of lectures and hands on exercises designed to reinforce the topics learnt


  • How to use the Bootstrap grid system
  • Using Bootstrap CSS techniques
  • Creating adaptive HTML content
  • Bootstrap best practices


Introduction to Bootstrap

  • Goals of Bootstrap
  • How to get Bootstrap
  • Overview of how to use Bootstrap in a Web app

The Bootstrap Grid System

  • Overview of grids in Bootstrap
  • The role of media queries
  • Grid options
  • Recommendations for different types of device
  • Column techniques

CSS Techniques

  • HTML5 doctype and viewport meta tags
  • Containers
  • Responsive images
  • Normalization


  • Headings
  • Inline headings
  • Emphasis
  • Abbreviations
  • Lists
  • Additional techniques


  • Displaying basic tables
  • Striped tables
  • Hover tables
  • Condensed tables
  • Contextual tables
  • Responsive tables
  • Additional techniques


  • Overview
  • Vertical forms
  • Inline forms
  • Horizontal forms
  • Form input controls
  • Form control states
  • Panels

Additional UI Techniques

  • Labels
  • Badges
  • Buttons and button groups
  • Dropdowns
  • Button dropdowns
  • Images and thumbnails
  • Alerts
  • Progress bars
  • Input groups
  • List groups


  • Tabular navigation
  • Tabs
  • Pills
  • Dropdowns
  • Navbar
  • Breadcrumbs

Additional Techniques

  • Helpers
  • Responsive utilities
  • Glyphicons
  • Pagination
  • Media objects
  • Using the modal plugin

Enquire about this course

"*" indicates required fields

By submitting this form, you agree to our Privacy Policy.
This field is for validation purposes and should be left unchanged.

More courses