Skip to content
Home Tutorials Roadmaps Courses
Log in Join free

CSS Complete Guide

Master CSS from selectors to Flexbox, Grid, animations and responsive design - build beautiful modern websites.

SU Taught by Sukhwinder Singh 0 enrolled Beginner

What you will learn

  • Style web pages using CSS selectors, properties and values
  • Master the CSS box model for precise layouts
  • Build responsive layouts with Flexbox and CSS Grid
  • Create animations and transitions for interactive UI
  • Write maintainable CSS with variables and best practices
Master CSS - the language that makes websites look beautiful and professional.

CSS (Cascading Style Sheets) controls the visual presentation of every web page. This course covers selectors, the box model, Flexbox, CSS Grid, responsive design with media queries, animations, transitions, custom properties and modern CSS features. Build visually stunning pages as you learn.

Who this is for:
- Beginners who know basic HTML and want to style websites
- Web developers wanting to master modern CSS layout techniques
- Anyone building personal or professional websites

Course Syllabus

0 lessons · 7 modules
1. CSS Basics 4 lessons
  1. Lesson content for "What is CSS? Inline, internal and external stylesheets".

    Want to watch the video lesson?

    Enroll now to get full video access + certificate.

    Coming soon
  2. Lesson content for "CSS selectors - element, class, id, universal".

    Want to watch the video lesson?

    Enroll now to get full video access + certificate.

    Coming soon
  3. Lesson content for "Specificity and cascade rules".

    Want to watch the video lesson?

    Enroll now to get full video access + certificate.

    Coming soon
  4. Lesson content for "Colors, backgrounds and gradients".

    Want to watch the video lesson?

    Enroll now to get full video access + certificate.

    Coming soon
2. Box Model & Typography 5 lessons
  1. Lesson content for "Margin, padding, border - the box model".

    Want to watch the video lesson?

    Enroll now to get full video access + certificate.

    Coming soon
  2. Lesson content for "Box-sizing - content-box vs border-box".

    Want to watch the video lesson?

    Enroll now to get full video access + certificate.

    Coming soon
  3. Lesson content for "Typography - fonts, sizes, line height, letter spacing".

    Want to watch the video lesson?

    Enroll now to get full video access + certificate.

    Coming soon
  4. Lesson content for "Google Fonts and web font loading".

    Want to watch the video lesson?

    Enroll now to get full video access + certificate.

    Coming soon
  5. Lesson content for "Text shadows, text alignment and wrapping".

    Want to watch the video lesson?

    Enroll now to get full video access + certificate.

    Coming soon
3. Flexbox Layout 4 lessons
  1. Lesson content for "Flex container - display flex, direction, wrap".

    Want to watch the video lesson?

    Enroll now to get full video access + certificate.

    Coming soon
  2. Lesson content for "Main axis and cross axis alignment".

    Want to watch the video lesson?

    Enroll now to get full video access + certificate.

    Coming soon
  3. Lesson content for "Flex items - grow, shrink, basis".

    Want to watch the video lesson?

    Enroll now to get full video access + certificate.

    Coming soon
  4. Lesson content for "Practical Flexbox layouts and exercises".

    Want to watch the video lesson?

    Enroll now to get full video access + certificate.

    Coming soon
4. CSS Grid Layout 4 lessons
  1. Lesson content for "Grid container - display grid, template columns".

    Want to watch the video lesson?

    Enroll now to get full video access + certificate.

    Coming soon
  2. Lesson content for "Grid rows, gaps and placement".

    Want to watch the video lesson?

    Enroll now to get full video access + certificate.

    Coming soon
  3. Lesson content for "Grid areas and template areas".

    Want to watch the video lesson?

    Enroll now to get full video access + certificate.

    Coming soon
  4. Lesson content for "Responsive grid with auto-fill and auto-fit".

    Want to watch the video lesson?

    Enroll now to get full video access + certificate.

    Coming soon
5. Responsive Design 4 lessons
  1. Lesson content for "Mobile-first approach and viewport meta tag".

    Want to watch the video lesson?

    Enroll now to get full video access + certificate.

    Coming soon
  2. Lesson content for "Media queries for breakpoints".

    Want to watch the video lesson?

    Enroll now to get full video access + certificate.

    Coming soon
  3. Lesson content for "Responsive images and srcset".

    Want to watch the video lesson?

    Enroll now to get full video access + certificate.

    Coming soon
  4. Lesson content for "Responsive typography with clamp()".

    Want to watch the video lesson?

    Enroll now to get full video access + certificate.

    Coming soon
6. Animations & Transitions 4 lessons
  1. Lesson content for "CSS transitions - hover effects and timing".

    Want to watch the video lesson?

    Enroll now to get full video access + certificate.

    Coming soon
  2. Lesson content for "Keyframe animations - bounce, slide, fade".

    Want to watch the video lesson?

    Enroll now to get full video access + certificate.

    Coming soon
  3. Lesson content for "Transform - rotate, scale, translate".

    Want to watch the video lesson?

    Enroll now to get full video access + certificate.

    Coming soon
  4. Lesson content for "Performance tips for animations".

    Want to watch the video lesson?

    Enroll now to get full video access + certificate.

    Coming soon
7. Advanced CSS 4 lessons
  1. Lesson content for "CSS custom properties (variables)".

    Want to watch the video lesson?

    Enroll now to get full video access + certificate.

    Coming soon
  2. Lesson content for "Pseudo-elements and pseudo-classes".

    Want to watch the video lesson?

    Enroll now to get full video access + certificate.

    Coming soon
  3. Lesson content for "Position - static, relative, absolute, fixed, sticky".

    Want to watch the video lesson?

    Enroll now to get full video access + certificate.

    Coming soon
  4. Lesson content for "Z-index and stacking contexts".

    Want to watch the video lesson?

    Enroll now to get full video access + certificate.

    Coming soon

Student reviews

No reviews yet - be the first after you complete the course!

Prerequisites

Basic HTML knowledge. A text editor like VS Code.

Related courses