CSS Mastery from Beginner to Advanced: Build responsive websites
Learn how to design modern and responsive CSS websites including CSS animation and transform
Updated on Jun, 2025
Language - English
Development ,Web Development,CSS
Lectures -361
Resources -2
Duration -79 hours
Lifetime Access
Lifetime Access
30-days Money-Back Guarantee
Get your team access to 10000+ top Tutorials Point courses anytime, anywhere.
Course Description
This is a detailed Web Design course showing you step by step patterns, hence this is a premium CSS course. I don’t just want you to watch. I encourage you to code along.
What you will learn.
- You will thoroughly learn how to create equal and unequal columns using both the float and inline-block property.
- You will learn how to create image gallery and video gallery with columns
- You will thoroughly learn how to work with 2D and 3D transforms, transitions and animations
- You will thoroughly learn how to make shapes with clip path property
- You will thoroughly learn how to use the CSS Media (@media) Query to make your web design mobile friendly and responsive. This means mobile-first approach.
- You will thoroughly learn how to create navigation menus – horizontal, vertical and mega menus
- You will learn how to add images and videos to mega menus
- You will thoroughly learn how to create gradients – linear (), Radial (), and conic () gradients
- You will thoroughly learn how to create CSS accordions and tooltips (top, bottom, left and right tooltips)
- You will thoroughly learn how to design price tables
- You will thoroughly learn about the box model and the importance of box-sizing property
- You will learn how to reference CSS with inline, internal and external styling and also learn how to import CSS
- You will learn how to work with colors – Hexadecimal, RGB, HSL, color keywords
- You will thoroughly learn how to work with font properties – font-size, line-height, font family, font-weight
- You will thoroughly learn how to work with text properties and word properties
- You will thoroughly learn how to work with CSS length units – rem, em, px, %, vh, vw, pc, pt
- You will thoroughly learn how to import font awesome in order to incorporate it in your design
- You will thoroughly learn how to import Google fonts as part of your font family
- You will thoroughly learn the types of selectors and how to combine them for ease of use
- You will thoroughly learn how the cascading rule works
- And so much more....
Goals
- Design cool websites from scratch to finish having mastered the CSS Concepts
- Be skilled with CSS transitions including understanding timing-functions and cubic-bezier
- Be able to work with 2D and 3D transforms (rotate, skew, scale, translate, matrix)
- Wow yourself with how to design and structure image and video gallery
- Understand how CSS Animation work and how to work with keyframes
- Improve your skill on creating navigation bars and mega menus
- Fully harness the power of CSS Media (@media) Query to make your web design mobile friendly and responsive
- Be able to work with CSS length units – rem, em, px, %, vh, vw, pc, pt
- Be confident with the HTML 5 document structure and be able to use semantic HTML 5 elements
Prerequisites
- No programming skill required. This premium CSS course will teach you from scratch
- You will require a PC, a text editor like Visual Studio Code, or Sublime text, Brackets, Notepad++.
- Using an earpiece/headset to listen to the course will help your focus and have more control over your volume
Curriculum
Check out the detailed breakdown of what’s inside the course
Introduction
7 Lectures
-
Overview of some projects we will create
15:01
15:01
-
The final project we will build
04:09
04:09
-
Editors to be used in this course
06:39
06:39
-
Getting familiar with Visual studio code
12:51
12:51
-
Importing the lesson folder
11:58
11:58
-
Introduction to CSS
07:36
07:36
-
Why I choose to minify my code
04:55
04:55
Styling in CSS
2 Lectures
CSS Colors
5 Lectures
Font properties
6 Lectures
CSS Length Units
8 Lectures
Text properties
7 Lectures
CSS Rule
5 Lectures
CSS Selectors
20 Lectures
Font Awesome
3 Lectures
Display property and Box Model
19 Lectures
Box Sizing
2 Lectures
Overflow
2 Lectures
Vertical Align
1 Lectures
CSS Functions
4 Lectures
CSS Media Query @media
5 Lectures
Float property
2 Lectures
Creating columns of different sizes
24 Lectures
Multiple Columns with column-count
2 Lectures
Scroll bar and cursors
3 Lectures
Positioning in CSS
13 Lectures
Gradient colour function
8 Lectures
Object fit and position property
3 Lectures
Background image
10 Lectures
CSS filter property
3 Lectures
Styling Lists
7 Lectures
CSS Form
5 Lectures
CSS counter
5 Lectures
Navigation bars
23 Lectures
CSS Accordion and Tooltips
9 Lectures
Creating and Styling Tables
7 Lectures
Creating a pricing table/plan
11 Lectures
CSS clip path property
12 Lectures
Mask-image Property
2 Lectures
CSS 2D Transform
5 Lectures
CSS 3D Transform
18 Lectures
CSS Transitions
10 Lectures
CSS Animations
23 Lectures
Final Web Project | Home Page | MegaProxy
30 Lectures
Final Web Project | Courses Page
10 Lectures
Final Web Page | Team Page
5 Lectures
Final Web Page | Blog
5 Lectures
Final Web Page | Contact
4 Lectures
Final Web Page | Gallery
6 Lectures
Instructor Details
Pamch Tutors
Course Certificate
Use your certificate to make a career change or to advance in your current career.
Our students work
with the Best
Related Video Courses
View MoreAnnual Membership
Become a valued member of Tutorials Point and enjoy unlimited access to our vast library of top-rated Video Courses
Subscribe now
Online Certifications
Master prominent technologies at full length and become a valued certified professional.
Explore Now