Up and Running with Bootstrap

Bootstrap is a free web development tool from Twitter that, with a little bit of CSS and JavaScript experience, makes building websites quick, intuitive, and fun. Author Jen Kramer explores its 12-column grid layout; typography and icon libraries; fully functional components like nav bars, buttons, and tabs; and much more. This course also shows how to add JavaScript extras like dropdown menus, modal windows, and photo carousels.

Topics include:

• Understanding the difference between default and fluid grids
• Nesting with fluid grids
• Creating a thumbnail gallery
• Adding block quotes and lists of text
• Incorporating images and icons
• Adding breadcrumb navigation and pagination
• Using tabs and pills navigation
• Making the nav bar responsive with JavaScript
• Adding dropdown menus to the nav bar, tabs, and pill

Table of content

• Introduction
  • Welcome
  • Using the exercise files
• Getting Started with Bootstrap
  • What is Bootstrap?
  • Downloading and unzipping Bootstrap
  • Setting up a Dreamweaver site with Bootstrap files
• The Grid System in Bootstrap
  • Understanding the difference between default and fluid grids
  • Exploring the fluid grid and creating new rows
  • Understanding fluid offsetting
  • Nesting with fluid grids
  • Exploring Bootstrap media queries and device-specific styling
  • Adding a hero unit
  • Creating a thumbnail gallery
• CSS Overview
  • Exploring basic typography
  • Including blockquotes
  • Including lists
  • Styling buttons
  • Incorporating images
  • Incorporating icons
  • Overriding Bootstrap core CSS
• Navigation Systems
  • Adding breadcrumbs
  • Adding pagination for paging through content
  • Adding a page for next and previous links
  • Using tabs and pills navigation
  • Adding the basic navigation bar
• JavaScript Effects
  • Understanding how JavaScript works in Bootstrap
  • Making the nav bar responsive with JavaScript
  • Adding a dropdown menu to the navigation bar
  • Adding a dropdown menu to the tabs and pill navigation
  • Tabbing within the same page
  • Creating modal windows
  • Creating a photo carousel
• Conclusion
  • Other resources

Rapidgator.net

1. bit.ly/1pt2Uvp