CF

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

11h 31m 23s
English
Paid

CSS Bootcamp - Master CSS (Including CSS Grid / Flexbox) is a 87-lesson 11 hours 31 minutes self-paced course by Udemy. Course consists of several sections.

Course facts

Lessons
87
Duration
11 hours 31 minutes
Level
All levels
Language
English
Updated
Instructor
Udemy
Price
Premium

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.

"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

Who teaches CSS Bootcamp - Master CSS (Including CSS Grid / Flexbox)? Udemy

Udemy thumbnail

Udemy is the largest open marketplace for online courses on the internet. Founded in 2010 by Eren Bali, Oktay Caglar, and Gagan Biyani and headquartered in San Francisco, the company went public on the Nasdaq in 2021 under the ticker UDMY. The platform hosts well over two hundred thousand courses across software development, IT and cloud, data science, design, business, marketing, and creative skills, taught by tens of thousands of independent instructors. Roughly seventy million learners use it worldwide, and the corporate arm — Udemy Business — supplies a curated subset of that catalog to enterprise customers.

Because Udemy is a marketplace rather than a single editorial publisher, the catalog is uneven by design. The strongest material lives in the long-form, project-based courses authored by working engineers — full-stack JavaScript, React, Node.js, Python data science, AWS, Docker and Kubernetes, mobile development with Flutter and React Native, and cloud certification preparation. The CourseFlix listing under this source is the slice of that catalog that has been mirrored here for offline-friendly viewing, organized by topic and updated as new releases land. Pricing on Udemy itself swings dramatically with the site's near-permanent sales, which is why the platform is best treated as a deep reference catalog: pick instructors with strong reviews and a track record of updating their material rather than buying on the headline price alone.

What lessons are included in CSS Bootcamp - Master CSS (Including CSS Grid / Flexbox)?

This is a demo lesson (10:00 remaining)

You can watch up to 10 minutes for free. Subscribe to unlock all 87 lessons in this course and access 10,000+ hours of premium content across all courses.

View Pricing
0:00
/
#1: Introduction
All Course Lessons (87)
#Lesson TitleDurationAccess
1
Introduction Demo
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
Unlock unlimited learning

Get instant access to all 86 lessons in this course, plus thousands of other premium courses. One subscription, unlimited knowledge.

Learn more about subscription

What courses are similar to CSS Bootcamp - Master CSS (Including CSS Grid / Flexbox)?

More courses by Udemy

Frequently asked questions

What prerequisites are recommended before taking this course?
Before enrolling in this CSS Bootcamp, it's beneficial to have a basic understanding of HTML since CSS is used to style HTML elements. Familiarity with basic web design concepts will help, but the course begins with CSS essentials, making it accessible for beginners.
What projects will I build during the course?
You will work on the 'Grand Hotel' project, which involves creating a responsive website. This project covers multiple aspects from setting up a sidebar, navigation, header, and various sections like 'About Us' and 'Rooms', to making the entire project responsive using Flexbox and CSS Grid.
Who is the target audience for this course?
The course is designed for beginners and intermediate learners who want to enhance their CSS skills. It's ideal for those looking to understand both basic and advanced CSS concepts, including Flexbox and CSS Grid, to build modern, responsive websites.
How does the course depth compare to other CSS courses?
This course covers both fundamental and advanced topics in CSS. Unlike some introductory courses, it delves into complex subjects like transitions, transforms, animations, and advanced layout techniques with Flexbox and CSS Grid, making it suitable for learners seeking comprehensive CSS knowledge.
What specific CSS tools and platforms are covered?
The course includes detailed lessons on CSS Grid and Flexbox, two powerful layout models. Additionally, it covers CSS selectors, pseudo-classes, pseudo-elements, and various CSS properties for styling backgrounds, shadows, and text formatting.
What topics are not covered in this CSS course?
The course does not cover CSS preprocessors like SASS or LESS, nor does it delve into JavaScript frameworks for styling. The focus remains on core CSS capabilities for styling and layout, including modern techniques like Flexbox and Grid.
How much time should I expect to commit to this course?
The course contains 87 lessons. While the exact runtime isn't specified, students should be prepared to devote several hours to complete the course, especially if they engage with the practical exercises and the 'Grand Hotel' project for hands-on experience.