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

11h 31m 23s
English
Paid

Course consists of several sections. You will start from CSS essentials, in which you will meet some basic topics. Then after finishing basic part, you will move on to advanced CSS, where you will be able to learn advanced things in CSS, such as: backgrounds, transitions, transforms, animations, shadows and much more.

Read more about the course

"CSS Bootcamp - Master in CSS (Including CSS Grid / Flexbox)".

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

Included:

1. CSS Basics

2. Advanced CSS

3. Flexbox

4. Project 1 - "Grand Hotel" (Based on Flexbox)

5. CSS Grid

6. Project 2 - "Furniture Website" (Based on CSS Grid)

Advanced CSS section will be followed by CSS Flexbox part, in which you will learn about how to create layout of your web page using CSS Flexbox. After Flexbox section, we will build our first project - "Grand Hotel". It will be a real-world, modern-looking and beautiful web page about hotel. Layout of this project will be fully created using CSS Flexbox.

Next, you will move on to CSS Grid. In which you will learn about this new powerful layout module. And lastly, we will build another big project based on CSS Grid.

Each project built throughout the course, will be fully responsive for all screen device.

Throughout the course, you will meet detailed explanations about how bootstrap works, also, you will introduce to modern practices and solutions.

Who this course is for:

  • Students with zero experience in CSS
  • Students who have some basic knowledge in CSS and want to get deep understanding in CSS
  • Everyone who wants to become Master in CSS

Watch Online CSS Bootcamp - Master CSS (Including CSS Grid / Flexbox)

Join premium to watch
Go to premium
# Title Duration
1 Introduction 03:32
2 Setup 04:29
3 What is CSS? 03:18
4 How to write CSS? 09:33
5 HTML Elements Tree 02:04
6 CSS Selectors 09:01
7 CSS Combinators 05:11
8 CSS Colors 05:35
9 Inheritance 03:19
10 Text Formatting - Part 1 06:06
11 Text Formatting - Part 2 09:38
12 Box Model 12:55
13 Pseudo Classes - Part 1 07:29
14 Pseudo Classes - Part 2 04:01
15 Pseudo Elements 04:04
16 Measurement Units - Part 1 06:40
17 Measurement Units - Part 2 06:25
18 Positions - Part 1 06:13
19 Positions - Part 2 08:51
20 Overflow 03:38
21 Floats 05:55
22 Backgrounds - Part 1 12:01
23 Backgrounds - Part 2 08:21
24 Gradients 06:34
25 Shadows 07:57
26 Transitions 10:15
27 Transforms - Part 1 07:15
28 Transforms - Part 2 04:40
29 Animations - Part 1 07:30
30 Animations - Part 2 08:25
31 What Is Flexbox? 06:19
32 Flex Container Properties 14:56
33 Flex Items Properties 09:36
34 Grand Hotel - Project Preview 10:20
35 Sidebar - Markup 05:52
36 Sidebar - Style 11:52
37 Navigation - Markup 06:02
38 Navigation - Style - Part 1 12:45
39 Navigation - Style - Part 2 09:53
40 Create Click Event 10:49
41 Create markup for Header 04:03
42 Header - Style 14:11
43 About Us Section - Markup 04:32
44 About Us Section - Style - Part 1 12:46
45 About Us Section - Style - Part 2 05:54
46 Rooms Section - Markup 06:34
47 Rooms Section - Style 12:41
48 Customers Section - Markup 04:18
49 Customers Section - Style 07:08
50 Footer - Markup 08:46
51 Footer - Style 14:51
52 Make "Grand Hotel" Project Responsive - Part 1 07:32
53 Make "Grand Hotel" Project Responsive - Part 2 09:37
54 Make "Grand Hotel" Project Responsive - Part 3 12:15
55 CSS Grid Introduction 04:47
56 Setup 05:30
57 How To Create Grid 06:20
58 Fractional Units 06:09
59 Positioning and Spanning Grid Items 09:28
60 Naming Grid Items - Part 1 09:29
61 Naming Grid Items - Part 2 10:03
62 Naming Grid areas 05:08
63 Explicit and Implicit Grid 06:01
64 Aligning Grid items 06:21
65 Aligning Grid tracks 04:07
66 max-content, min-content, minmax() 05:07
67 auto-fill, auto-fit 04:40
68 Furniture Store - Project Preview 02:46
69 Navbar - Part 1 - Markup 05:07
70 Navbar - Part 1 - Style 16:39
71 Navbar - Search Form 06:06
72 Navbar - Part 2 - Markup 05:38
73 Navbar - Part 2 - Style 10:27
74 Navbar - Part 2 - Dropdown 08:09
75 Banner - Markup 04:27
76 Banner - Style 11:07
77 Banner Slideshow - Part 1 06:51
78 Banner Slideshow - Part 2 06:44
79 Day Offer Section 13:01
80 Bestselling Furniture - Markup 04:42
81 Bestselling Furniture - Style 09:52
82 Gallery 10:29
83 Contact Section and Footer 09:57
84 Modal box - Markup 08:16
85 Modal Box - Style - Part 1 11:53
86 Modal Box - Style - Part 2 09:46
87 Make Project Responsive 21:49

Similar courses to CSS Bootcamp - Master CSS (Including CSS Grid / Flexbox)

10 Mega Responsive Websites with HTML, CSS, and JavaScript

10 Mega Responsive Websites with HTML, CSS, and JavaScriptudemy

Category: JavaScript, HTML, CSS
Duration 21 hours 54 minutes 19 seconds
Tailwind Mastery

Tailwind MasteryBuild UI

Category: CSS
Duration 2 hours 34 minutes 57 seconds
Ultimate PHP, Laravel, CSS & Sass! Learn PHP, Laravel & Sass

Ultimate PHP, Laravel, CSS & Sass! Learn PHP, Laravel & Sassudemy

Category: CSS, Laravel, PHP
Duration 95 hours 30 minutes
Flexbox Simplified

Flexbox Simplifiedkevin powell

Category: CSS
Duration 4 hours 41 minutes 57 seconds
The CSS Bootcamp: Zero to Mastery

The CSS Bootcamp: Zero to Masteryzerotomastery.io

Category: CSS
Duration 40 hours 15 minutes 13 seconds
CSS Layout Masterclass

CSS Layout MasterclassNomad Coders

Category: CSS
Duration 6 hours 49 minutes 41 seconds
Complete Web Developer in 2023: Zero to Mastery

Complete Web Developer in 2023: Zero to Masteryudemyzerotomastery.io

Category: JavaScript, HTML, CSS
Duration 35 hours 23 minutes 21 seconds
The Ultimate HTML5 & CSS3 Series: Part 3

The Ultimate HTML5 & CSS3 Series: Part 3codewithmosh (Mosh Hamedani)

Category: HTML, CSS
Duration 5 hours 38 minutes 4 seconds
Modern HTML & CSS From The Beginning Course

Modern HTML & CSS From The Beginning CourseBrad Traversy

Category: HTML, CSS
Duration 24 hours 21 minutes 52 seconds