Welcome to the Ultimate CSS Full Course - It’s designed for complete beginners with no coding experience, and by the end, you'll be able to write CSS at a professional level.
The course is by far the most comprehensive and high-quality course you’ll find online, and goes well beyond the standard tutorials you’ll see elsewhere on YouTube.
CSS Full Course - Part 1 - https://www.youtube.com/watch?v=-G-zic_LS0A
Topic 1 - Introduction to CSS
- Introduction to CSS
- Including CSS
Topic 2 - CSS Text
- Text Styling
- Text Spacing
- Text Size
- Font
- Color
- Style Guide
Topic 3 - CSS Selectors
- The Type Selector
- The Cascade
- Grouping Selectors
- Class & ID Selectors
- Pseudo-classes
- Combinator Selectors
- Specificity
- CSS Inheritance
- The Universal Selector
- Psuedo-elements
Topic 4 - CSS Box Model
- CSS Box Model Introduction
- Background Color
- Width and Height
- Padding
- Border
- Border Radius
- Box Sizing
- Margin
- Display
- CSS Reset
- Main Container
- Maximum Width
- Minimum Width
- Maximum & Minimum Height
Topic 5 - CSS Units
- Absolute & Relative Units
- Percentages
- rems & ems
- vw & vh
Topic 6 - CSS Functions
- CSS Variables
- CSS Calculations
Topic 7 - Flexbox
- Introduction to Flexbox
- Normal Flow vs. Flexbox
- Justify Content
- Align Items
- Gap
- Nested Flexbox
CSS Full Course - Part 2:
Topic 7 - Flexbox
0:00:00 Centering
0:48:57 Flex Children
1:16:40 Flex Wrap and Align Content
Topic 8: CSS Grid
1:31:32 Introduction to Grid
1:45:20 Grid Columns and Rows
2:12:48 Grid Gap
2:23:23 Grid Cell Alignment
2:36:24 Grid Container Alignment
2:51:13 Grid Items
Topic 9: Responsive Design
3:12:03 Introduction to Media Queries
3:53:22 Breakpoints
4:26:58 CSS and Physics Pixels
Topic 10: Positioning
4:38:33 Positioning
5:08:51 Z-index and Stacking Context
5:26:20 Transform
Topic 11: Shadows and Transitions
5:48:10 Shadows
6:00:05 Transitions
Topic 12: CSS Frameworks
6:18:00 Introduction to CSS Frameworks
6:24:15 Bootstrap
7:29:33 Tailwind CSS
Important links:
💻 Join Future Fullstack Bootcamp: https://www.futurefullstack.com/
📕 Download Summary Cards: https://bit.ly/css-summary-cards
🎥 Download Presentation Slides: https://bit.ly/css-presentation-slides
📋Quill starter HTML: https://bit.ly/quill-html-files
🪶Quill completed HTML & CSS: https://bit.ly/quill-complete-html-css