CSS Bootcamp: Master CSS (Including CSS Grid/Flexbox)

CSS Bootcamp: Master CSS (Including CSS Grid/Flexbox)

by George Lomidze
Released March 2020
Publisher(s): Packt Publishing
ISBN: 9781800202801

Read it now on the O’Reilly learning platform with a 10-day free trial.

O’Reilly members get unlimited access to books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.

Start your free trial

Video description

If you want to learn how to create modern real-world websites using pure CSS, then this is the right course for you.

The course starts by covering CSS essentials. You will then move on to advanced CSS concepts such as transform, backgrounds, transitions, animations, and shadows. After this, you’ll learn how to create a layout of your web page using CSS Flexbox. In the next section, you will build your first project - Grand Hotel. It will be a real-world, intuitive web page about hotels created using CSS Flexbox. Later, you will move on to exploring CSS Grid, before finally building another project based on CSS Grid. Each project built throughout the course will be fully compatible across all screen devices.

By the end of this course, you will have developed the skills you need to confidently create responsive websites using CSS Grid and Flexbox.

What You Will Learn

  • Understand how to create the layout of your web page using CSS Flexbox
  • Align elements using modern CSS Flexbox and CSS Grid modules
  • Build fully responsive websites that work across different screen devices

Audience

This course is for anyone who wants to create modern, responsive websites using CSS Grid and Flexbox. No prior CSS experience is required to get started with this course.

About The Author

George Lomidze: George Lomidze is a full-stack web developer/designer, co-founder at ‘Code and Create’, and an author of several best-selling courses on Udemy. He is excited that he has a chance to help people learn one of the most interesting and hottest fields in the world.

He specializes in the following technologies: HTML, CSS, SASS, Bootstrap, JavaScript, React, React Native, NodeJS, MongoDB, Express, and many more. He is looking forward to seeing you follow his courses and helping you become a professional web developer.

He is also the founder of MicroGrinder Poker School, an online poker school dedicated to micro stakes poker players, where he provides a wide array of free and low-cost poker resources and poker training, including poker strategy articles and poker training videos series. He is also the Amazon #1 best-selling author of Essential Poker Math, Expanded Edition.

Table of contents

  1. Chapter 1 : Welcome
    1. Introduction
    2. Setup
  2. Chapter 2 : CSS Basics
    1. What is CSS?
    2. How to write CSS?
    3. HTML Elements Tree
    4. CSS Selectors
    5. CSS Combinators
    6. CSS Colors
    7. Inheritance
    8. Text Formatting - Part 1
    9. Text Formatting - Part 2
    10. Box Model
    11. Pseudo Classes - Part 1
    12. Pseudo Classes - Part 2
    13. Pseudo Elements
    14. Measurement Units - Part 1
    15. Measurement Units - Part 2
    16. Positions - Part 1
    17. Positions - Part 2
    18. Overflow
    19. Floats
  3. Chapter 3 : Advanced CSS
    1. Backgrounds - Part 1
    2. Backgrounds - Part 2
    3. Gradients
    4. Shadows
    5. Transitions
    6. Transforms - Part 1
    7. Transforms - Part 2
    8. Animations - Part 1
    9. Animations - Part 2
  4. Chapter 4 : Flexbox
    1. What Is Flexbox?
    2. Flex Container Properties
    3. Flex Items Properties
  5. Chapter 5 : Project 1 - Grand Hotel (Based on Flexbox)
    1. Grand Hotel - Project Preview
    2. Sidebar - Markup
    3. Sidebar - Style
    4. Navigation - Markup
    5. Navigation - Style - Part 1
    6. Navigation - Style - Part 2
    7. Create Click Event
    8. Create markup for Header
    9. Header - Style
    10. About Us Section - Markup
    11. About Us Section - Style - Part 1
    12. About Us Section - Style - Part 2
    13. Rooms Section - Markup
    14. Rooms Section - Style
    15. Customers Section - Markup
    16. Customers Section - Style
    17. Footer - Markup
    18. Footer - Style
  6. Chapter 6 : Responsive Web Design
    1. Make "Grand Hotel" Project Responsive - Part 1
    2. Make "Grand Hotel" Project Responsive - Part 2
    3. Make "Grand Hotel" Project Responsive - Part 3
  7. Chapter 7 : CSS Grid
    1. CSS Grid Introduction
    2. Setup
    3. How to Create Grid
    4. Fractional Units
    5. Positioning and Spanning Grid Items
    6. Naming Grid Items - Part 1
    7. Naming Grid Items - Part 2
    8. Naming Grid areas
    9. Explicit and Implicit Grid
    10. Aligning Grid items
    11. Aligning Grid tracks
    12. max-content, min-content, minmax()
    13. auto-fill, auto-fit
  8. Chapter 8 : Project 2 - Furniture Store (Based on CSS Grid)
    1. Furniture Store - Project Preview
    2. Navbar - Part 1 - Markup
    3. Navbar - Part 1 - Style
    4. Navbar - Search Form
    5. Navbar - Part 2 - Markup
    6. Navbar - Part 2 - Style
    7. Navbar - Part 2 - Dropdown
    8. Banner - Markup
    9. Banner - Style
    10. Banner Slideshow - Part 1
    11. Banner Slideshow - Part 2
    12. Day Offer Section
    13. Bestselling Furniture - Markup
    14. Bestselling Furniture - Style
    15. Gallery
    16. Contact Section and Footer
    17. Modal box - Markup
    18. Modal Box - Style - Part 1
    19. Modal Box - Style - Part 2
    20. Make Project Responsive

Product information

  • Title: CSS Bootcamp: Master CSS (Including CSS Grid/Flexbox)
  • Author(s): George Lomidze
  • Release date: March 2020
  • Publisher(s): Packt Publishing
  • ISBN: 9781800202801