CSS Simplified
15h 17m 44s
English
Paid
Course description
Learn how to create beautiful websites with over 100 video tutorials and 20+ unique projects designed to make learning CSS as easy and understandable as possible.
Read more about the course
What makes this course unique?
- Much more than basic knowledge
- You will delve into CSS, learning not only the basics but also advanced techniques.
- Time-saving
- I have condensed over ten years of CSS experience to shorten your path to mastery to 16 hours of learning.
- Affordable price
- Everything you need is gathered in one place at an affordable price, so you won't have to spend money on other courses.
- Become a 10x developer
- By the end of the course, you will know CSS 10 times better than most developers, including senior specialists.
- Successful interviews
- Since few developers truly master CSS, the knowledge you gain will help you stand out and take top spots on candidate lists.
- Always current knowledge
- The course is regularly updated with new CSS features, ensuring that you are always aware of the latest innovations.
- Real projects
- You will create real projects, such as a Discord clone and attractive landing pages, which will enhance your portfolio.
This course is your chance to quickly and effectively master CSS and elevate your web development skills to an entirely new level!
Watch Online
0:00
/ #1: 01 - What Is CSS
All Course Lessons (101)
| # | Lesson Title | Duration | Access |
|---|---|---|---|
| 1 | 01 - What Is CSS Demo | 02:11 | |
| 2 | 02 - CSS Basic Syntax | 11:30 | |
| 3 | 03 - How To Add CSS | 06:31 | |
| 4 | 04 - CSS Comments | 02:59 | |
| 5 | 05 - CSS Inheritance | 04:03 | |
| 6 | 06 - Your First CSS Project - A Simple Blog | 09:36 | |
| 7 | 07 - User Profile Introduction | 01:43 | |
| 8 | 08 - User Profile Project Walkthrough | 05:40 | |
| 9 | 09 - CSS Color | 12:41 | |
| 10 | 10 - CSS Specificity | 12:28 | |
| 11 | 11 - Pseudo Classes | 05:37 | |
| 12 | 12 - Box Model | 13:09 | |
| 13 | 13 - CSS Units | 11:14 | |
| 14 | 14 - Input Component Library Introduction | 01:35 | |
| 15 | 15 - Input Component Library Walkthrough | 06:50 | |
| 16 | 16 - Button Component Library Introduction | 01:22 | |
| 17 | 17 - Button Component Library Walkthrough | 14:04 | |
| 18 | 18 - Portfolio Project | 27:43 | |
| 19 | 19 - Document Flow | 08:26 | |
| 20 | 20 - Floats | 04:35 | |
| 21 | 21 - Flexbox | 20:37 | |
| 22 | 22 - Modal Project | 14:01 | |
| 23 | 23 - Navbar Project Introduction | 00:45 | |
| 24 | 24 - Navbar Project Walkthrough | 04:50 | |
| 25 | 25 - Grid | 25:09 | |
| 26 | 26 - Grid Home Page Project | 12:19 | |
| 27 | 27 - Image Gallery Project Introduction | 00:57 | |
| 28 | 28 - Image Grid Project Walkthrough | 06:38 | |
| 29 | 29 - Subgrid | 06:29 | |
| 30 | 30 - Mutli-value Display | 06:44 | |
| 31 | 31 - Position | 10:45 | |
| 32 | 32 - z-index | 07:14 | |
| 33 | 33 - Logical Properties | 10:26 | |
| 34 | 34 - Multi-Column Layout | 08:02 | |
| 35 | 35 - Overflow | 07:42 | |
| 36 | 36 - Text Wrapping | 11:47 | |
| 37 | 37 - Advanced Margins | 02:54 | |
| 38 | 38 - Viewport Meta Tag | 01:50 | |
| 39 | 39 - Media Query | 11:40 | |
| 40 | 40 - Container Query | 06:55 | |
| 41 | 41 - Responsive House Project Introduction | 02:55 | |
| 42 | 42 - Responsive House Project Walkthrough | 05:19 | |
| 43 | 43 - Media Queries For Accessibility | 03:50 | |
| 44 | 44 - Responsive Design Without Media Queries | 11:06 | |
| 45 | 45 - Custom Properties | 06:05 | |
| 46 | 46 - @property | 06:39 | |
| 47 | 47 - Custom Media Queries | 09:55 | |
| 48 | 48 - Calc | 04:59 | |
| 49 | 49 - Nesting | 07:40 | |
| 50 | 50 - Layers | 14:05 | |
| 51 | 51 - Input Component Library Updates Introduction | 00:38 | |
| 52 | 52 - Input Component Library Updates Walkthrough | 04:06 | |
| 53 | 53 - Button Component Library Updates Introduction | 01:12 | |
| 54 | 54 - Button Component Library Updates Walkthrough | 05:55 | |
| 55 | 55 - @scope | 08:08 | |
| 56 | 56 - calc-size | 02:01 | |
| 57 | 57 - Custom Fonts | 08:41 | |
| 58 | 58 - Gradients | 20:04 | |
| 59 | 59 - Color Spaces | 15:07 | |
| 60 | 60 - Advanced Color Functions | 18:24 | |
| 61 | 61 - Relative Colors | 09:19 | |
| 62 | 62 - Built In Color Properties | 04:38 | |
| 63 | 63 - Button Component Library Colors Introduction | 01:13 | |
| 64 | 64 - Button Component Library Colors Walkthrough | 09:27 | |
| 65 | 65 - Relationship Selectors | 04:14 | |
| 66 | 66 - Attribute Selectors | 05:18 | |
| 67 | 67 - Pseudo Elements | 06:24 | |
| 68 | 68 - Custom Checkbox Project | 12:32 | |
| 69 | 69 - Parent Selector | 11:27 | |
| 70 | 70 - where vs is | 07:04 | |
| 71 | 71 - Child Selectors | 06:46 | |
| 72 | 72 - Focus Selectors | 05:15 | |
| 73 | 73 - Additional Pseudo Classes | 10:27 | |
| 74 | 74 - Input Component Library Validation Introduction | 01:16 | |
| 75 | 75 - Input Component Library Validation Walkthrough | 09:39 | |
| 76 | 76 - Transition Property | 08:00 | |
| 77 | 77 - Button Transition Project Introduction | 00:56 | |
| 78 | 78 - Button Transition Project Walkthrough | 05:02 | |
| 79 | 79 - Animation Property | 14:11 | |
| 80 | 80 - Transform | 15:04 | |
| 81 | 81 - Button Animation Project | 09:25 | |
| 82 | 82 - Loading Text Project Introduction | 00:44 | |
| 83 | 83 - Loading Text Project Walkthrough | 08:52 | |
| 84 | 84 - Animating Custom Properties | 03:44 | |
| 85 | 85 - @starting-style & transition-behavior | 07:15 | |
| 86 | 86 - interpolate-size | 01:51 | |
| 87 | 87 - Modal Animation Introduction | 01:04 | |
| 88 | 88 - Modal Animation Walkthrough | 05:17 | |
| 89 | 89 - Perspective Property | 07:42 | |
| 90 | 90 - 3D Cube Project | 11:07 | |
| 91 | 91 - Next Steps | 04:17 | |
| 92 | 92 - CSS Reset | 03:16 | |
| 93 | 93 - Browser Support | 03:50 | |
| 94 | 94 - Feature Query | 04:55 | |
| 95 | 95 - @import | 08:05 | |
| 96 | 96 - Vendor Prefixes | 02:29 | |
| 97 | 97 - CSS Frameworks | 05:18 | |
| 98 | 98 - MNTN Landing Page Introduction | 04:36 | |
| 99 | 99 - MNTN Landing Page Walkthrough | 01:02:17 | |
| 100 | 100 - Discord Clone Introduction | 10:37 | |
| 101 | 101 - Discord Clone Walkthrough | 01:44:21 |
Unlock unlimited learning
Get instant access to all 100 lessons in this course, plus thousands of other premium courses. One subscription, unlimited knowledge.
Learn more about subscriptionBooks
Read Book CSS Simplified
| # | Title |
|---|---|
| 1 | CSS Box Model Cheat Sheet - Dark |
| 2 | CSS Box Model Cheat Sheet - Light |
| 3 | CSS Selector Cheat Sheet - Dark |
| 4 | CSS Selector Cheat Sheet - Light |
Comments
0 commentsWant to join the conversation?
Sign in to commentSimilar courses
Learn CSS Today
Sources: webdevsimplified.com
Learn modern CSS features and advanced CSS concepts in less than a day with this highly focused project-based CSS course.
9 hours 31 minutes 49 seconds
Pixel Perfect Figma to Tailwind
Sources: protailwind.com (Simon Vrachliotis), Simon Vrachliotis
This workshop is designed to help you achieve 'pixel-perfect' design implementations, bridging the fidelity gap between design and development. Throughout...
2 hours 40 minutes 16 seconds
Web Developer Bootcamp with Flask and Python in 2022
Sources: udemy
Welcome to the Web Developer Bootcamp with Flask and Python! In this course, you'll learn how to build and deploy dynamic websites using Python, Flask, MongoDB,
19 hours 57 minutes 43 seconds
Flexbox Simplified
Sources: kevin powell
Flexbox is a wonderful tool that opens up the world of responsive layouts, but it can be hard to predict exactly what's going to happen when we use it, and it's full of sometime...
4 hours 41 minutes 57 seconds
HTML/CSS Bootcamp - Learn HTML, CSS, Flexbox, and CSS Grid
Sources: udemy
Hi and welcome to the HTML/CSS Bootcamp course, where we'll walk through the same course I teach code bootcamp students around the world.
20 hours 55 minutes 14 seconds