Submodule 3.3: Responsive Design and Bootstrap Grid System

  • Responsive WEB design 
  • Bootstrap grid system - container, row, column
  • Mobile first - media queries - viewport meta tag
  • Customize the CSS classes - external style sheet - inline CSS
  • Flex order - position

Introduction

In this submodule, you will be given an overview of responsive web design and an introduction to the Bootstrap grid system.

  • Part 1 introduces you to responsive design and Bootstrap support for mobile first responsive design through the use of the grid system
  • We also learn, in Part 2,  how to customize some of the Bootstrap classes by defining our own modifications in a separate CSS file.