Bootstrap 5

Bootstrap is a ready-made set of CSS and components that makes good-looking, responsive pages quick to build. You will use its grid, its components, and its utility classes.

Updated

Bootstrap

  1. What is Bootstrap? (Novice): Bootstrap is a free CSS framework of ready-made styles and components; add it to a page with two lines from a CDN and start using its classes.
  2. The Grid System (Apprentice): Lay out a page in Bootstrap's 12-column grid of containers, rows and columns, and make the layout change at each screen size with breakpoints.
  3. Components (Apprentice): Build a page from Bootstrap's ready-made components (buttons, navbars, cards, tables, forms, alerts and carousels) by copying their HTML and changing the content.
  4. Utility Classes (Apprentice): Adjust spacing, color, text, borders and flex layout with Bootstrap's small, single-purpose utility classes, without writing CSS.

Exercise: Bootstrap

  1. Exercise: Bootstrap (Apprentice): Build a four-page bookstore with Bootstrap 5, with a navbar, a carousel, a table of books with a paging button group, and two forms, and check it at every screen size.