Bootstrap Development Course
CLASS DATE(s):
6/4/2020 - 6/5/2020
8/6/2020 - 8/7/2020

COURSE LENGTH: 2 Days

COURSE COST: $625.00

COURSE TIMES: 9:00am - 4:30pm

Printable version of this course
print
Register for this course
register

COURSE OVERVIEW

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.
This 2 day course you will learn all the nuts and bolts of Bootstrap to develop a 100% responsive website. Particularly we focus on CSS, Components, JavaScript implementations, Less & SASS, and customization of Bootstrap in our course.

AUDIENCE AND PREREQUISITES

This course is for anybody who creates and/or develops web sites or applications needing a framework to help them quickly prototype their designs or speed up their design process.

What you'll learn:
•How to use the Bootstrap grid system
•Using Bootstrap CSS techniques
•Creating adaptive HTML content
•Bootstrap best practices
•Familiarity with HTML and JavaScript programming

  

*Course cost listed does not include the cost of courseware (required) or lunch (optional). Please contact us at learn@vtec.org or 207-775-0244 for additional pricing information, or if you have any questions. Course subject to minimum enrollment. Course may run as a Live Distance Learning (LDL) session if minimum enrollment is not met. Requirements
Web hosting is required (can be a free one).
We recommend the following web hosting providers:
HostGator.com
PacificHost.com
BlueHost.com

jQuery required -All plugins require the latest version of jQuery to be included.

COURSE TOPICS:


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

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

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

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

Additional UI Techniques
•Labels
•Badges
•Buttons and button groups
•Images and thumbnails
•Alerts
•Progress bars
•Input groups
•List groups

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

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